From 84e08415f7d0100cb7d71a729a8f17df6084f17f Mon Sep 17 00:00:00 2001
From: Aidan Jones <aejones4gm@gmail.com>
Date: Tue, 4 Feb 2025 11:13:56 -0500
Subject: [PATCH] Rename superFormData var to form

The original code was necessary because there was a reactive declaration using a variable from the props named form to conditionally redirect if the form was accepted. This was factored out in the Svelte 5 upgrade. This changes in this commit were originally part of that PR, but were split out to make the Svelte 5 PR as minimal as possible.
---
 .../settings/organizations/edit/+page.svelte  | 34 ++++++--------
 .../product-definitions/edit/+page.svelte     | 27 ++++-------
 .../settings/store-types/edit/+page.svelte    | 17 ++-----
 .../admin/settings/stores/edit/+page.svelte   | 19 +++-----
 .../workflow-definitions/edit/+page.svelte    | 45 +++++--------------
 .../[id]/settings/groups/+page.svelte         |  1 -
 .../[id]/settings/info/+page.svelte           | 11 +++--
 .../[id]/settings/infrastructure/+page.svelte | 10 ++---
 .../[id]/settings/products/+page.svelte       | 10 ++---
 .../[id]/settings/stores/+page.svelte         |  8 +---
 10 files changed, 58 insertions(+), 124 deletions(-)

diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/organizations/edit/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/organizations/edit/+page.svelte
index 16d247cc1..5bb1634ee 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/organizations/edit/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/organizations/edit/+page.svelte
@@ -12,11 +12,7 @@
   }
 
   let { data }: Props = $props();
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     dataType: 'json',
     onUpdated(event) {
       if (event.form.valid) {
@@ -25,23 +21,19 @@
     }
   });
 
-  let getStoreInfo = $derived((store: (typeof $superFormData)['stores'][0]) =>
-    data.options.stores.find((s) => s.Id === store.storeId));
+  let getStoreInfo = $derived((store: (typeof $form)['stores'][0]) =>
+    data.options.stores.find((s) => s.Id === store.storeId)
+  );
 </script>
 
 <!-- <SuperDebug data={superForm} /> -->
 <form class="m-4" method="post" action="?/edit" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <LabeledFormInput name="admin_settings_organizations_name">
-    <input
-      class="input w-full input-bordered"
-      type="text"
-      name="name"
-      bind:value={$superFormData.name}
-    />
+    <input class="input w-full input-bordered" type="text" name="name" bind:value={$form.name} />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_organizations_owner">
-    <select class="select select-bordered" name="owner" bind:value={$superFormData.owner}>
+    <select class="select select-bordered" name="owner" bind:value={$form.owner}>
       {#each data.options.users as option}
         <option value={option.Id}>{option.Name}</option>
       {/each}
@@ -52,7 +44,7 @@
       name="websiteURL"
       class="input input-bordered w-full"
       type="text"
-      bind:value={$superFormData.websiteURL}
+      bind:value={$form.websiteURL}
     />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_organizations_buildEngineURL">
@@ -60,7 +52,7 @@
       name="buildEngineURL"
       class="input input-bordered w-full"
       type="text"
-      bind:value={$superFormData.buildEngineURL}
+      bind:value={$form.buildEngineURL}
     />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_organizations_accessToken">
@@ -68,7 +60,7 @@
       name="buildEngineAccessToken"
       class="input input-bordered w-full"
       type="text"
-      bind:value={$superFormData.buildEngineAccessToken}
+      bind:value={$form.buildEngineAccessToken}
     />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_organizations_logoURL">
@@ -76,7 +68,7 @@
       name="logoURL"
       class="input input-bordered w-full"
       type="text"
-      bind:value={$superFormData.logoURL}
+      bind:value={$form.logoURL}
     />
   </LabeledFormInput>
   <div>
@@ -94,14 +86,14 @@
           name="publicByDefault"
           class="toggle toggle-accent"
           type="checkbox"
-          bind:checked={$superFormData.publicByDefault}
+          bind:checked={$form.publicByDefault}
         />
       </div>
     </label>
   </div>
 
   <MultiselectBox header={m.org_storeSelectTitle()}>
-    {#each $superFormData.stores as store}
+    {#each $form.stores as store}
       <MultiselectBoxElement
         bind:checked={store.enabled}
         title={getStoreInfo(store)?.Name ?? ''}
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/product-definitions/edit/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/product-definitions/edit/+page.svelte
index 51a2e9c01..f9c0b6a4b 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/product-definitions/edit/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/product-definitions/edit/+page.svelte
@@ -10,11 +10,7 @@
   }
 
   let { data }: Props = $props();
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     onUpdated(event) {
       if (event.form.valid) {
         goto('/admin/settings/product-definitions');
@@ -28,20 +24,15 @@
 
 <!-- <SuperDebug data={superForm} /> -->
 <form class="m-4" method="post" action="?/edit" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <LabeledFormInput name="admin_settings_productDefinitions_name">
-    <input
-      class="input w-full input-bordered"
-      type="text"
-      name="name"
-      bind:value={$superFormData.name}
-    />
+    <input class="input w-full input-bordered" type="text" name="name" bind:value={$form.name} />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_productDefinitions_type">
     <select
       class="select select-bordered"
       name="applicationType"
-      bind:value={$superFormData.applicationType}
+      bind:value={$form.applicationType}
     >
       {#each data.options.applicationTypes as type}
         <option value={type.Id}>{type.Name}</option>
@@ -49,7 +40,7 @@
     </select>
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_productDefinitions_workflow">
-    <select class="select select-bordered" name="workflow" bind:value={$superFormData.workflow}>
+    <select class="select select-bordered" name="workflow" bind:value={$form.workflow}>
       {#each workflows.filter((w) => w.Type) as workflow}
         <option value={workflow.Id}>{workflow.Name}</option>
       {/each}
@@ -59,7 +50,7 @@
     <select
       class="select select-bordered"
       name="rebuildWorkflow"
-      bind:value={$superFormData.rebuildWorkflow}
+      bind:value={$form.rebuildWorkflow}
     >
       <option value={null}>{m.admin_settings_productDefinitions_noWorkflow()}</option>
       {#each rebuildWorkflows.filter((w) => w.Type) as workflow}
@@ -71,7 +62,7 @@
     <select
       class="select select-bordered"
       name="republishWorkflow"
-      bind:value={$superFormData.republishWorkflow}
+      bind:value={$form.republishWorkflow}
     >
       <option value={null}>{m.admin_settings_productDefinitions_noWorkflow()}</option>
       {#each republishWorkflows.filter((w) => w.Type) as workflow}
@@ -83,14 +74,14 @@
     <textarea
       name="description"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.description}
+      bind:value={$form.description}
     ></textarea>
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_productDefinitions_properties">
     <textarea
       name="properties"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.properties}
+      bind:value={$form.properties}
     ></textarea>
   </LabeledFormInput>
   {#if $allErrors.length}
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/store-types/edit/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/store-types/edit/+page.svelte
index dac26f4ba..c4a1aa005 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/store-types/edit/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/store-types/edit/+page.svelte
@@ -9,11 +9,7 @@
   }
 
   let { data }: Props = $props();
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     onUpdated(event) {
       if (event.form.valid) {
         goto('/admin/settings/store-types');
@@ -24,20 +20,15 @@
 
 <!-- <SuperDebug data={superForm} /> -->
 <form class="m-4" method="post" action="?/edit" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <LabeledFormInput name="admin_settings_storeTypes_name">
-    <input
-      class="input w-full input-bordered"
-      type="text"
-      name="name"
-      bind:value={$superFormData.name}
-    />
+    <input class="input w-full input-bordered" type="text" name="name" bind:value={$form.name} />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_storeTypes_description">
     <textarea
       name="description"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.description}
+      bind:value={$form.description}
     ></textarea>
   </LabeledFormInput>
   {#if $allErrors.length}
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/stores/edit/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/stores/edit/+page.svelte
index 335010163..57d723c17 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/stores/edit/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/stores/edit/+page.svelte
@@ -9,11 +9,7 @@
   }
 
   let { data }: Props = $props();
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     onUpdated(event) {
       if (event.form.valid) {
         goto('/admin/settings/stores');
@@ -24,24 +20,19 @@
 
 <!-- <SuperDebug data={superForm} /> -->
 <form class="m-4" method="post" action="?/edit" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <LabeledFormInput name="stores_attributes_name">
-    <input
-      class="input w-full input-bordered"
-      type="text"
-      name="name"
-      bind:value={$superFormData.name}
-    />
+    <input class="input w-full input-bordered" type="text" name="name" bind:value={$form.name} />
   </LabeledFormInput>
   <LabeledFormInput name="stores_attributes_description">
     <textarea
       name="description"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.description}
+      bind:value={$form.description}
     ></textarea>
   </LabeledFormInput>
   <LabeledFormInput name="storeTypes_name">
-    <select class="select select-bordered" name="storeType" bind:value={$superFormData.storeType}>
+    <select class="select select-bordered" name="storeType" bind:value={$form.storeType}>
       {#each data.options as option}
         <option value={option.Id}>{option.Name}</option>
       {/each}
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/workflow-definitions/edit/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/workflow-definitions/edit/+page.svelte
index 2444b4d4b..c59ec08c4 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/workflow-definitions/edit/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/admin/settings/workflow-definitions/edit/+page.svelte
@@ -12,11 +12,7 @@
   }
 
   let { data }: Props = $props();
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     dataType: 'json',
     onUpdated(event) {
       if (event.form.valid) {
@@ -43,28 +39,19 @@
 
 <!-- <SuperDebug data={superForm} /> -->
 <form class="m-4" method="post" action="?/edit" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <LabeledFormInput name="admin_settings_workflowDefinitions_name">
-    <input
-      class="input w-full input-bordered"
-      type="text"
-      name="name"
-      bind:value={$superFormData.name}
-    />
+    <input class="input w-full input-bordered" type="text" name="name" bind:value={$form.name} />
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_workflowDefinitions_storeType">
-    <select class="select select-bordered" name="storeType" bind:value={$superFormData.storeType}>
+    <select class="select select-bordered" name="storeType" bind:value={$form.storeType}>
       {#each data.storeTypes as storeType}
         <option value={storeType.Id}>{storeType.Name}</option>
       {/each}
     </select>
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_workflowDefinitions_productType">
-    <select
-      class="select select-bordered"
-      name="productType"
-      bind:value={$superFormData.productType}
-    >
+    <select class="select select-bordered" name="productType" bind:value={$form.productType}>
       <option value={ProductType.Android_GooglePlay}>Android GooglePlay</option>
       <option value={ProductType.Android_S3}>Android S3</option>
       <option value={ProductType.AssetPackage}>
@@ -76,11 +63,7 @@
     </select>
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_workflowDefinitions_workflowType">
-    <select
-      class="select select-bordered"
-      name="workflowType"
-      bind:value={$superFormData.workflowType}
-    >
+    <select class="select select-bordered" name="workflowType" bind:value={$form.workflowType}>
       <option value={1}>{m.admin_settings_workflowDefinitions_workflowTypes_1()}</option>
       <option value={2}>{m.admin_settings_workflowDefinitions_workflowTypes_2()}</option>
       <option value={3}>{m.admin_settings_workflowDefinitions_workflowTypes_3()}</option>
@@ -90,15 +73,11 @@
     <textarea
       name="description"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.description}
+      bind:value={$form.description}
     ></textarea>
   </LabeledFormInput>
   <LabeledFormInput name="admin_settings_workflowDefinitions_workflowScheme">
-    <select
-      class="select select-bordered"
-      name="workflowScheme"
-      bind:value={$superFormData.workflowScheme}
-    >
+    <select class="select select-bordered" name="workflowScheme" bind:value={$form.workflowScheme}>
       {#each data.schemes as scheme}
         <option value={scheme.Code}>{scheme.Code}</option>
       {/each}
@@ -108,7 +87,7 @@
     <select
       class="select select-bordered"
       name="workflowBusinessFlow"
-      bind:value={$superFormData.workflowBusinessFlow}
+      bind:value={$form.workflowBusinessFlow}
     >
       {#each businessFlows as flow}
         <option value={flow}>{flow}</option>
@@ -119,7 +98,7 @@
     <textarea
       name="properties"
       class="textarea textarea-bordered w-full"
-      bind:value={$superFormData.properties}
+      bind:value={$form.properties}
     ></textarea>
   </LabeledFormInput>
   <LabeledFormInput
@@ -136,7 +115,7 @@
         <input
           class="toggle toggle-warning border-warning"
           type="checkbox"
-          bind:group={$superFormData.options}
+          bind:group={$form.options}
           value={opt.value}
         />
       </div>
@@ -157,7 +136,7 @@
           name="enabled"
           class="toggle toggle-accent"
           type="checkbox"
-          bind:checked={$superFormData.enabled}
+          bind:checked={$form.enabled}
         />
       </div>
     </label>
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/groups/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/groups/+page.svelte
index 7284b19ab..821394564 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/groups/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/groups/+page.svelte
@@ -9,7 +9,6 @@
   }
 
   let { data }: Props = $props();
-  // export let form: ActionData;
   const { form: addForm, enhance: addEnhance, allErrors } = superForm(data.addForm);
   const { form: deleteForm, enhance: deleteEnhance } = superForm(data.deleteForm);
 </script>
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/info/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/info/+page.svelte
index 387015cfb..c53a4f558 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/info/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/info/+page.svelte
@@ -9,12 +9,11 @@
   }
 
   let { data }: Props = $props();
-  // export let form: ActionData;
-  const { form: superFormData, enhance, allErrors } = superForm(data.form, { resetForm: false });
+  const { form, enhance, allErrors } = superForm(data.form, { resetForm: false });
 </script>
 
 <form action="" class="m-4" method="post" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <div class="flex flex-row">
     <div>
       <LabeledFormInput name="org_orgName">
@@ -22,7 +21,7 @@
           type="text"
           name="name"
           class="input w-full input-bordered"
-          bind:value={$superFormData.name}
+          bind:value={$form.name}
         />
       </LabeledFormInput>
       <LabeledFormInput name="org_logoUrl">
@@ -30,13 +29,13 @@
           type="text"
           name="logoUrl"
           class="input w-full input-bordered"
-          bind:value={$superFormData.logoUrl}
+          bind:value={$form.logoUrl}
         />
         <span>{org_noteLogUrl()}</span>
       </LabeledFormInput>
     </div>
     <div class="w-1/3 ml-4">
-      <img src={$superFormData.logoUrl} alt="Logo" class="object-contain" />
+      <img src={$form.logoUrl} alt="Logo" class="object-contain" />
     </div>
   </div>
   <div class="my-4">
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/infrastructure/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/infrastructure/+page.svelte
index 9a78cebae..9d093b00f 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/infrastructure/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/infrastructure/+page.svelte
@@ -9,11 +9,11 @@
   }
 
   let { data }: Props = $props();
-  const { form: superFormData, enhance, allErrors } = superForm(data.form, { resetForm: false });
+  const { form, enhance, allErrors } = superForm(data.form, { resetForm: false });
 </script>
 
 <form action="" class="m-4" method="post" use:enhance>
-  <input type="hidden" name="id" value={$superFormData.id} />
+  <input type="hidden" name="id" value={$form.id} />
   <div class="flex flex-row">
     <div class="w-full">
       <div>
@@ -28,7 +28,7 @@
               name="useDefaultBuildEngine"
               class="toggle toggle-accent"
               type="checkbox"
-              bind:checked={$superFormData.useDefaultBuildEngine}
+              bind:checked={$form.useDefaultBuildEngine}
             />
           </div>
         </label>
@@ -38,7 +38,7 @@
           type="text"
           name="buildEngineUrl"
           class="input w-full input-bordered"
-          bind:value={$superFormData.buildEngineUrl}
+          bind:value={$form.buildEngineUrl}
         />
       </LabeledFormInput>
       <LabeledFormInput name="org_buildEngineApiAccessToken">
@@ -46,7 +46,7 @@
           type="text"
           name="buildEngineApiAccessToken"
           class="input w-full input-bordered"
-          bind:value={$superFormData.buildEngineApiAccessToken}
+          bind:value={$form.buildEngineApiAccessToken}
         />
       </LabeledFormInput>
     </div>
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/products/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/products/+page.svelte
index 3773d41f4..2c98303c2 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/products/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/products/+page.svelte
@@ -10,11 +10,7 @@
 
   let { data }: Props = $props();
 
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     dataType: 'json',
     resetForm: false
   });
@@ -37,13 +33,13 @@
           name="publicByDefault"
           class="toggle toggle-accent"
           type="checkbox"
-          bind:checked={$superFormData.publicByDefault}
+          bind:checked={$form.publicByDefault}
         />
       </div>
     </label>
   </div>
   <MultiselectBox header={m.org_productSelectTitle()}>
-    {#each $superFormData.products as productDef}
+    {#each $form.products as productDef}
       <MultiselectBoxElement
         title={data.allProductDefs.find((p) => p.Id === productDef.productId)?.Name ?? ''}
         description={data.allProductDefs.find((p) => p.Id === productDef.productId)?.Description ??
diff --git a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/stores/+page.svelte b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/stores/+page.svelte
index 341ad15a6..e02e800a5 100644
--- a/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/stores/+page.svelte
+++ b/source/SIL.AppBuilder.Portal/src/routes/(authenticated)/organizations/[id]/settings/stores/+page.svelte
@@ -10,11 +10,7 @@
 
   let { data }: Props = $props();
 
-  const {
-    form: superFormData,
-    enhance,
-    allErrors
-  } = superForm(data.form, {
+  const { form, enhance, allErrors } = superForm(data.form, {
     dataType: 'json',
     resetForm: false
   });
@@ -24,7 +20,7 @@
 <form action="" class="m-4" method="post" use:enhance>
   <MultiselectBox header={m.org_storeSelectTitle()}>
     <div>
-      {#each $superFormData.stores as store}
+      {#each $form.stores as store}
         <MultiselectBoxElement
           title={data.allStores.find((p) => p.Id === store.storeId)?.Name ?? ''}
           description={data.allStores.find((p) => p.Id === store.storeId)?.Description ?? ''}