How to save app metafield values using submit action and gql query

[Matty3]

Hi, I have been struggling with this for days now. I am trying to pass a variable to the action function to update app metafields on a submit button click. No matter which way I try, I am always getting back an error relating to the passed variable being null. This is the code I have:

The button click: 

  const handleSubmit = async () => {
    const dateValue = textFieldValue;
    console.log('after key presses: '+dateValue);
    submit( {variables: { myKey: dateValue }} , { replace: true, method: "post" });   
  }

and here is the code for the submit action: 

export const action = async ({ request, myKey }) => {
  
  const { admin } = await authenticate.admin(request);
  const response = await admin.graphql(
    `#graphql
      mutation CreateAppDataMetafield($metafieldsSetInput: [MetafieldsSetInput!]!) {
        metafieldsSet(metafields: $metafieldsSetInput) {
          metafields {
            id
            namespace
            value
            key
          }
          userErrors {
            field
            message
          }
        }
      }`,   
      {
        variables: {
          "metafieldsSetInput": [
            {
              "namespace": "settings-attributes",
              "key": "date-available",
              "type": "boolean",
              "value": "false",
              "ownerId": globalAppId
            },
            {
              "namespace": "settings-attributes",
              "key": "date",
              "type": "single_line_text_field",
              "value": myKey,
              "ownerId": globalAppId
            }            
          ]
        },
      },  
  );

  const data = await response.json();

  return json({
    data,
  });
};

If anyone has any ideas, I would be VERY grateful. Thanks