Fix strict null check in SiteSettings module (#2851)

* Fix strict null check in SiteSettings

* Improve urls

src/siteSettings/components/SiteSettingsPage/SiteSettingsPage.tsx

@@ -45,7 +45,7 @@ export interface SiteSettingsPageFormData
 export interface SiteSettingsPageProps {
   disabled: boolean;
   errors: ShopErrorFragment[];
-  shop: SiteSettingsQuery["shop"];
+  shop?: SiteSettingsQuery["shop"];
   saveButtonBarState: ConfirmButtonTransitionState;
   onSubmit: (data: SiteSettingsPageFormData) => SubmitPromise;
 }
@@ -107,10 +107,11 @@ const SiteSettingsPage: React.FC<SiteSettingsPageProps> = props => {
   const initialForm: SiteSettingsPageFormData = {
     ...initialFormAddress,
     description: shop?.description || "",
-    reserveStockDurationAnonymousUser: shop?.reserveStockDurationAnonymousUser,
+    reserveStockDurationAnonymousUser:
+      shop?.reserveStockDurationAnonymousUser ?? 0,
     reserveStockDurationAuthenticatedUser:
-      shop?.reserveStockDurationAuthenticatedUser,
-    limitQuantityPerCheckout: shop?.limitQuantityPerCheckout,
+      shop?.reserveStockDurationAuthenticatedUser ?? 0,
+    limitQuantityPerCheckout: shop?.limitQuantityPerCheckout ?? 0,
   };
 
   return (
@@ -179,7 +180,7 @@ const SiteSettingsPage: React.FC<SiteSettingsPageProps> = props => {
             </Grid>
             <Savebar
               state={saveButtonBarState}
-              disabled={isSaveDisabled}
+              disabled={!!isSaveDisabled}
               onCancel={() => navigate(configurationMenuUrl)}
               onSubmit={submit}
             />

src/siteSettings/fixtures.ts

@@ -12,14 +12,14 @@ export const shop: SiteSettingsQuery["shop"] = {
       code: "UA",
       country: "United Arab Emirates",
     },
-    countryArea: null,
-    firstName: null,
+    countryArea: "",
+    firstName: "",
     id: "1",
-    lastName: null,
+    lastName: "",
     phone: "+41 876-373-9137",
     postalCode: "89880-6342",
     streetAddress1: "01419 Bernhard Plain",
-    streetAddress2: null,
+    streetAddress2: "s",
   },
   countries: [
     {

src/siteSettings/index.tsx

@@ -6,8 +6,7 @@ import { siteSettingsPath, SiteSettingsUrlQueryParams } from "./urls";
 import SiteSettingsComponent from "./views/";
 
 const SiteSettings: React.FC<RouteComponentProps<{}>> = ({ location }) => {
-  const qs = parseQs(location.search.substr(1));
-  const params: SiteSettingsUrlQueryParams = qs;
+  const params: SiteSettingsUrlQueryParams = parseQs(location.search.slice(1));
 
   return <SiteSettingsComponent params={params} />;
 };

src/siteSettings/urls.ts

@@ -8,4 +8,4 @@ export const siteSettingsPath = siteSettingsSection;
 export type SiteSettingsUrlDialog = "add-key";
 export type SiteSettingsUrlQueryParams = Dialog<SiteSettingsUrlDialog>;
 export const siteSettingsUrl = (params?: SiteSettingsUrlQueryParams) =>
-  siteSettingsPath + "?" + stringifyQs(params);
+  `${siteSettingsPath}?${stringifyQs(params)}`;

src/siteSettings/views/index.tsx

@@ -34,8 +34,10 @@ export const SiteSettings: React.FC<SiteSettingsProps> = () => {
   ] = useShopSettingsUpdateMutation({
     onCompleted: data => {
       if (
-        [...data.shopAddressUpdate.errors, ...data.shopSettingsUpdate.errors]
-          .length === 0
+        [
+          ...(data?.shopAddressUpdate?.errors || []),
+          ...(data?.shopSettingsUpdate?.errors || []),
+        ].length === 0
       ) {
         notify({
           status: "success",
@@ -46,8 +48,8 @@ export const SiteSettings: React.FC<SiteSettingsProps> = () => {
   });
 
   const errors = [
-    ...(updateShopSettingsOpts.data?.shopSettingsUpdate.errors || []),
-    ...(updateShopSettingsOpts.data?.shopAddressUpdate.errors || []),
+    ...(updateShopSettingsOpts.data?.shopSettingsUpdate?.errors || []),
+    ...(updateShopSettingsOpts.data?.shopAddressUpdate?.errors || []),
   ];
   const loading = siteSettings.loading || updateShopSettingsOpts.loading;