slice-machine-ui 1.18.1-dev-next-release.3 → 1.18.1-dev-next-release.4

package/src/features/customTypes/__tests__/CustomTypesTablePage.test.tsx

@@ -42,18 +42,18 @@ describe.each(formats)(
           .closest("tr") as HTMLElement;
         expect(within(row).getByText(customTypeMock.id)).toBeVisible();
         expect(
-          within(row).getByText(customTypeMock.label as string)
+          within(row).getByText(customTypeMock.label as string),
         ).toBeVisible();
         expect(
           within(row).getByText(
-            customTypeMock.repeatable ? "Reusable" : "Single"
-          )
+            customTypeMock.repeatable ? "Reusable" : "Single",
+          ),
         ).toBeVisible();
       }
 
       // Check that there is the correct number of custom types displayed
       expect(screen.getAllByText(/MyID/)).toHaveLength(
-        customTypesMockByFormat[format].length
+        customTypesMockByFormat[format].length,
       );
     });
 
@@ -65,7 +65,7 @@ describe.each(formats)(
 
       // Ensure the modal is visible
       expect(
-        await screen.findByText(`Create a new ${format} type`)
+        await screen.findByText(`Create a new ${format} type`),
       ).toBeVisible();
 
       // Scope the test to the modal
@@ -75,10 +75,10 @@ describe.each(formats)(
 
       // Get form inputs
       const idInput = within(form).getByPlaceholderText(
-        CUSTOM_TYPES_MESSAGES[format].inputPlaceholder
+        CUSTOM_TYPES_MESSAGES[format].inputPlaceholder,
       );
       const nameInput = within(form).getByPlaceholderText(
-        `A display name for the ${format} type`
+        `A display name for the ${format} type`,
       );
 
       // Fill the form
@@ -95,7 +95,7 @@ describe.each(formats)(
       // Check that the redirection has been done
       if (format === "page") {
         expect(mockRouter.asPath).toEqual(
-          `/${format}-types/${newCustomType}?newPageType=true`
+          `/${format}-types/${newCustomType}?newPageType=true`,
         );
       } else {
         expect(mockRouter.asPath).toEqual(`/${format}-types/${newCustomType}`);
@@ -125,7 +125,7 @@ describe.each(formats)(
       // Check that the custom type is not visible
       await waitFor(() => {
         expect(
-          screen.queryByText(customTypesMockByFormat[format][0].id)
+          screen.queryByText(customTypesMockByFormat[format][0].id),
         ).not.toBeInTheDocument();
       });
     });
@@ -155,7 +155,7 @@ describe.each(formats)(
       // Get form input
       const renamedCustomType = `My renamed ${format} type`;
       const nameInput = within(form).getByPlaceholderText(
-        `A display name for the ${format} type`
+        `A display name for the ${format} type`,
       );
 
       // Clear the name and type a new one
@@ -168,7 +168,9 @@ describe.each(formats)(
       // Check that the old custom type label is not visible anymore
       await waitFor(() => {
         expect(
-          screen.queryByText(customTypesMockByFormat[format][0].label as string)
+          screen.queryByText(
+            customTypesMockByFormat[format][0].label as string,
+          ),
         ).not.toBeInTheDocument();
       });
 
@@ -184,10 +186,10 @@ describe.each(formats)(
 
       // Check that the redirection has been done
       expect(mockRouter.asPath).toEqual(
-        `/${format}-types/${customTypesMockByFormat[format][0].id}`
+        `/${format}-types/${customTypesMockByFormat[format][0].id}`,
       );
     });
-  }
+  },
 );
 
 describe("CustomTypesTablePage > Custom type", () => {
@@ -212,21 +214,21 @@ describe("CustomTypesTablePage > Custom type", () => {
     // Check that the custom type is not visible anymore
     await waitFor(() => {
       expect(
-        screen.queryByText(customTypesMockByFormat[format][0].label as string)
+        screen.queryByText(customTypesMockByFormat[format][0].label as string),
       ).not.toBeInTheDocument();
     });
 
     // Check that the converted custom type is visible on the page type table now
     rerender(<CustomTypesTablePage format="page" />);
     expect(
-      screen.getByText(customTypesMockByFormat[format][0].id)
+      screen.getByText(customTypesMockByFormat[format][0].id),
     ).toBeVisible();
   });
 });
 
 function createCustomTypesMock(
   format: CustomTypeFormat,
-  count: number
+  count: number,
 ): CustomType[] {
   return Array.from(Array(count), (_, index) => ({
     id: `MyID${format}${index}`,
@@ -275,7 +277,7 @@ async function renderCustomTypesTablePage({
       });
       hook("custom-type:read", (args: CustomTypeReadHookData) => {
         const model = customTypesMock.find(
-          (customTypeMock) => customTypeMock.id === args.id
+          (customTypeMock) => customTypeMock.id === args.id,
         );
 
         if (model) {
@@ -304,7 +306,7 @@ async function renderCustomTypesTablePage({
     createSliceMachineManagerMSWHandler({
       url: "http://localhost:3000/_manager",
       sliceMachineManager: manager,
-    })
+    }),
   );
 
   const customTypeMockStore = {
@@ -315,14 +317,14 @@ async function renderCustomTypesTablePage({
             ...obj,
             [item.id]: { local: CustomTypes.toSM(item) },
           }),
-          {}
+          {},
         ),
         ...customTypesMockByFormat.page.reduce(
           (obj, item) => ({
             ...obj,
             [item.id]: { local: CustomTypes.toSM(item) },
           }),
-          {}
+          {},
         ),
       },
       environment: {
@@ -335,12 +337,12 @@ async function renderCustomTypesTablePage({
   const renderResults = render(
     <CustomTypesTablePage format={format} />,
     // @ts-expect-error TS2345: Argument of type '{ preloadedState: { availableCustomTypes: {}; environment: { manifest: { apiEndpoint: string; }; }; slices: { libraries: never[]; remoteSlices: never[]; }; }; }' is not assignable to parameter of type 'Partial<{ preloadedState: Partial<SliceMachineStoreType>; store: Store<SliceMachineStoreType, AnyAction>; } & RenderOptions<...>>'.
-    customTypeMockStore
+    customTypeMockStore,
   );
 
   // Ensure table finished loading
   expect(
-    await screen.findByText(customTypesMockByFormat[format][0].id)
+    await screen.findByText(customTypesMockByFormat[format][0].id),
   ).toBeVisible();
 
   return renderResults;

package/src/features/customTypes/actions/convertCustomToPageType.ts

@@ -9,7 +9,7 @@ import { CUSTOM_TYPES_MESSAGES } from "../customTypesMessages";
 
 export async function convertCustomToPageType(
   customType: CustomType,
-  saveCustomType: (customType: CustomType) => void
+  saveCustomType: (customType: CustomType) => void,
 ) {
   const customTypesMessages =
     CUSTOM_TYPES_MESSAGES[customType.format as CustomTypeFormat];
@@ -27,14 +27,14 @@ export async function convertCustomToPageType(
       `${customTypesMessages.name({
         start: true,
         plural: false,
-      })} converted to page type`
+      })} converted to page type`,
     );
   } catch (e) {
     toast.error(
       `Internal Error: ${customTypesMessages.name({
         start: true,
         plural: false,
-      })} not converted to page type`
+      })} not converted to page type`,
     );
   }
 }

package/src/features/customTypes/actions/deleteCustomType.ts

@@ -25,7 +25,7 @@ export async function deleteCustomType({
       `${customTypesMessages.name({
         start: true,
         plural: false,
-      })} deleted`
+      })} deleted`,
     );
   } catch (e) {
     const errorMessage = `Internal Error: ${customTypesMessages.name({

package/src/features/customTypes/actions/renameCustomType.ts

@@ -33,7 +33,7 @@ export async function renameCustomType({
       `${customTypesMessages.name({
         start: true,
         plural: false,
-      })} renamed`
+      })} renamed`,
     );
   } catch (e) {
     const errorMessage = `Internal Error: ${customTypesMessages.name({

package/src/features/customTypes/customTypesBuilder/CustomTypesBuilderPage.tsx

@@ -37,9 +37,9 @@ export const CustomTypesBuilderPage: FC = () => {
     (store: SliceMachineStoreType) => ({
       selectedCustomType: selectCustomTypeById(
         store,
-        readBuilderPageDynamicSegment(router.query) as string
+        readBuilderPageDynamicSegment(router.query) as string,
       ),
-    })
+    }),
   );
 
   const { cleanupCustomTypeStore } = useSliceMachineActions();
@@ -94,7 +94,7 @@ const CustomTypesBuilderPageWithProvider: React.FC<
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
       /* leave this empty to prevent local updates to disappear */
-    ]
+    ],
   );
 
   const { currentCustomType, hasPendingModifications, isSavingCustomType } =

package/src/features/customTypes/customTypesConfig.ts

@@ -28,15 +28,15 @@ export const CUSTOM_TYPES_CONFIG = {
 
 export function matchesBuilderPagePathname(
   pathname: string,
-  customTypeId: string
+  customTypeId: string,
 ): boolean {
   return Object.values(CUSTOM_TYPES_CONFIG).some(({ getBuilderPagePathname }) =>
-    pathname.startsWith(getBuilderPagePathname(customTypeId))
+    pathname.startsWith(getBuilderPagePathname(customTypeId)),
   );
 }
 
 export function readBuilderPageDynamicSegment(
-  query: NextRouter["query"]
+  query: NextRouter["query"],
 ): string | undefined {
   const customTypesConfigValues = Object.values(CUSTOM_TYPES_CONFIG);
   for (const { builderPageDynamicSegment } of customTypesConfigValues) {

package/src/features/customTypes/customTypesTable/CustomTypesTable.tsx

@@ -46,7 +46,7 @@ export const CustomTypesTable: FC<CustomTypesTableProps> = ({
   const sortedCustomTypes = customTypes.sort(
     (customType1: CustomType, customType2: CustomType) => {
       return customType1.id.localeCompare(customType2.id);
-    }
+    },
   );
   const customTypesConfig = CUSTOM_TYPES_CONFIG[format];
   const customTypesMessages = CUSTOM_TYPES_MESSAGES[format];
@@ -102,7 +102,7 @@ export const CustomTypesTable: FC<CustomTypesTableProps> = ({
                 key={id}
                 onClick={() => {
                   void router.push(
-                    CUSTOM_TYPES_CONFIG[format].getBuilderPagePathname(id)
+                    CUSTOM_TYPES_CONFIG[format].getBuilderPagePathname(id),
                   );
                 }}
               >

package/src/features/customTypes/customTypesTable/CustomTypesTablePage.tsx

@@ -38,9 +38,9 @@ export const CustomTypesTablePage: FC<CustomTypesTablePageProps> = ({
     (store: SliceMachineStoreType) => ({
       isCreatingCustomType: isLoading(
         store,
-        LoadingKeysEnum.CREATE_CUSTOM_TYPE
+        LoadingKeysEnum.CREATE_CUSTOM_TYPE,
       ),
-    })
+    }),
   );
 
   return (
@@ -59,7 +59,7 @@ export const CustomTypesTablePage: FC<CustomTypesTablePageProps> = ({
                 <DefaultErrorMessage
                   title="Request failed"
                   description={`An error occurred while fetching your ${customTypesMessages.name(
-                    { start: false, plural: true }
+                    { start: false, plural: true },
                   )}.`}
                 />
               </Box>

package/src/features/customTypes/customTypesTable/createCustomType.ts

@@ -5,7 +5,7 @@ export function createCustomType(
   id: string,
   label: string,
   repeatable: boolean,
-  format: CustomTypeFormat
+  format: CustomTypeFormat,
 ): CustomType {
   const mainTab = makeMainTab(repeatable, format);
 
@@ -21,7 +21,7 @@ export function createCustomType(
 
 function makeMainTab(
   repeatable: boolean,
-  format: CustomTypeFormat
+  format: CustomTypeFormat,
 ): CustomType["json"] {
   if (repeatable === false && format === "page") {
     return { ...DEFAULT_MAIN_WITH_SLICE_ZONE, ...DEFAULT_SEO_TAB };

package/src/features/customTypes/customTypesTable/useCustomTypes.ts

@@ -16,11 +16,11 @@ type UseCustomTypesReturnType = {
 };
 
 export function useCustomTypes(
-  format: CustomTypeFormat
+  format: CustomTypeFormat,
 ): UseCustomTypesReturnType {
   const updateCustomTypes = useCallback(
     (data: CustomType[]) => updateData(getCustomTypes, [format], data),
-    [format]
+    [format],
   );
 
   return {
@@ -31,7 +31,7 @@ export function useCustomTypes(
 
 async function getCustomTypes(format: CustomTypeFormat): Promise<CustomType[]> {
   const { errors, models } = await managerClient.customTypes.readAllCustomTypes(
-    { format }
+    { format },
   );
 
   if (errors.length > 0) {
@@ -48,7 +48,7 @@ async function getCustomTypes(format: CustomTypeFormat): Promise<CustomType[]> {
 export function useCustomTypesAutoRevalidation(
   customTypes: CustomType[],
   format: CustomTypeFormat,
-  updateCustomTypes: (data: CustomType[]) => void
+  updateCustomTypes: (data: CustomType[]) => void,
 ): void {
   const { storeCustomTypes } = useSelector((store: SliceMachineStoreType) => ({
     storeCustomTypes: selectAllCustomTypes(store).filter(hasLocal),
@@ -56,7 +56,7 @@ export function useCustomTypesAutoRevalidation(
 
   useEffect(() => {
     const storeCustomTypesFiltered = storeCustomTypes.filter(
-      ({ local }) => local.format === format
+      ({ local }) => local.format === format,
     );
 
     if (
@@ -66,7 +66,7 @@ export function useCustomTypesAutoRevalidation(
         // the one from suspense because it could not be the same after some
         // modifications (rename, add/remove field, new tab, etc.)
         const currentCustomType = customTypes.find(
-          (ct2: CustomType) => ct2.id === ct.local.id
+          (ct2: CustomType) => ct2.id === ct.local.id,
         );
 
         return (
@@ -77,7 +77,7 @@ export function useCustomTypesAutoRevalidation(
       })
     ) {
       const newCustomTypes: CustomType[] = storeCustomTypesFiltered.map(
-        ({ local }) => CustomTypes.fromSM(local)
+        ({ local }) => CustomTypes.fromSM(local),
       );
 
       updateCustomTypes(newCustomTypes);

package/src/features/labs/labsList/LabsList.tsx

@@ -10,7 +10,7 @@ import { type UseLabArgs, type UseLabReturnType, useLab } from "./useLab";
 export const LabsList: FC = () => {
   const [legacySliceUpgraderLab, setLegacySliceUpgraderLab] = useLabWithToast(
     "legacySliceUpgrader",
-    "Legacy Slice Upgrader"
+    "Legacy Slice Upgrader",
   );
 
   return (
@@ -53,7 +53,7 @@ function useLabWithToast(key: UseLabArgs, name: string): UseLabReturnType {
 
       openToaster(
         enabled ? `Labs: enabled ${name}` : `Labs: disabled ${name}`,
-        ToasterType.SUCCESS
+        ToasterType.SUCCESS,
       );
     } catch (error) {
       console.error(error);
@@ -62,7 +62,7 @@ function useLabWithToast(key: UseLabArgs, name: string): UseLabReturnType {
         enabled
           ? `Labs: failed to enable ${name}`
           : `Labs: failed to disable ${name}`,
-        ToasterType.ERROR
+        ToasterType.ERROR,
       );
     }
   };

package/src/features/labs/labsList/useLab.tsx

@@ -6,7 +6,7 @@ export type UseLabArgs = keyof Required<SliceMachineConfig>["labs"];
 
 export type UseLabReturnType = [
   lab: { enabled: boolean },
-  setLab: (enabled: boolean) => Promise<void>
+  setLab: (enabled: boolean) => Promise<void>,
 ];
 
 export function useLab(key: UseLabArgs): UseLabReturnType {

package/src/features/slices/actions/addSlicesToSliceZone.ts

@@ -35,7 +35,7 @@ export async function addSlicesToSliceZone({
                 ],
               },
             }
-          : tab
+          : tab,
       ),
     };
   });

package/src/features/slices/convertLegacySlice/ConvertLegacySliceAsNewSliceDialog.tsx

@@ -86,14 +86,14 @@ export const ConvertLegacySliceAsNewSliceDialog: FC<DialogProps> = ({
                       </label>
                       <FormInput
                         placeholder={`Pascalised Slice API ID (e.g. ${pascalize(
-                          slice.key
+                          slice.key,
                         )})`}
                         error={typeof formik.errors.sliceName === "string"}
                         value={formik.values.sliceName}
                         onValueChange={(value) =>
                           void formik.setFieldValue(
                             "sliceName",
-                            value.slice(0, 30)
+                            value.slice(0, 30),
                           )
                         }
                         data-cy="slice-name-input"

package/src/features/slices/convertLegacySlice/ConvertLegacySliceAsNewVariationDialog.tsx

@@ -137,7 +137,7 @@ export const ConvertLegacySliceAsNewVariationDialog: FC<DialogProps> = ({
 
                           if (inferIDFromName) {
                             values.variationID = Variation.generateId(
-                              values.variationName
+                              values.variationName,
                             );
                           }
 
@@ -163,7 +163,7 @@ export const ConvertLegacySliceAsNewVariationDialog: FC<DialogProps> = ({
                           setInferIDFromName(false);
                           void formik.setFieldValue(
                             "variationID",
-                            Variation.generateId(value.slice(0, 30))
+                            Variation.generateId(value.slice(0, 30)),
                           );
                         }}
                         data-cy="variation-id-input"
@@ -191,7 +191,7 @@ export const ConvertLegacySliceAsNewVariationDialog: FC<DialogProps> = ({
 
 const validateAsNewVariationValues = (
   values: FormValues,
-  libraries: readonly LibraryUI[]
+  libraries: readonly LibraryUI[],
 ): Partial<Record<keyof FormValues, string>> => {
   const errors: Partial<Record<keyof FormValues, string>> = {};
 
@@ -199,7 +199,7 @@ const validateAsNewVariationValues = (
     errors.libraryID = "Cannot be empty.";
   }
   const library = libraries.find(
-    (library) => library.path === values.libraryID
+    (library) => library.path === values.libraryID,
   );
   // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
   if (!errors.libraryID && !library) {
@@ -210,7 +210,7 @@ const validateAsNewVariationValues = (
     errors.sliceID = "Cannot be empty.";
   }
   const slice = library?.components.find(
-    (component) => component.model.id === values.sliceID
+    (component) => component.model.id === values.sliceID,
   );
   // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
   if (!errors.sliceID && !slice) {

package/src/features/slices/convertLegacySlice/ConvertLegacySliceButton.tsx

@@ -49,7 +49,7 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
   const { libraries: allLibraries } = useSelector(
     (store: SliceMachineStoreType) => ({
       libraries: getLibraries(store),
-    })
+    }),
   );
 
   const sliceName =
@@ -63,11 +63,11 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
   const identicalSlices = useIdenticalSlices(
     slice,
     sliceName,
-    localSharedSlices
+    localSharedSlices,
   );
 
   const convertLegacySliceAndTrack = async (
-    args: ConvertLegacySliceAndTrackArgs
+    args: ConvertLegacySliceAndTrackArgs,
   ) => {
     if (!dialog) {
       return;
@@ -103,7 +103,7 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
 
       openToaster(
         `Could not convert slice \`${sliceName}\``,
-        ToasterType.ERROR
+        ToasterType.ERROR,
       );
 
       throw errors;
@@ -117,12 +117,12 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
     if (customTypeReadErrors.length || !customType) {
       console.error(
         `Could not refresh custom type view \`${path.customTypeID}\``,
-        customTypeReadErrors
+        customTypeReadErrors,
       );
 
       openToaster(
         `Could not refresh custom type view \`${path.customTypeID}\``,
-        ToasterType.ERROR
+        ToasterType.ERROR,
       );
 
       return;
@@ -139,14 +139,14 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
       case "as_new_slice":
         openToaster(
           `${sliceName} has been upgraded to a new slice ${args.libraryID} > ${args.sliceID}`,
-          ToasterType.SUCCESS
+          ToasterType.SUCCESS,
         );
         break;
 
       case "as_new_variation":
         openToaster(
           `${sliceName} has been converted as a variation of ${args.libraryID} > ${args.sliceID}`,
-          ToasterType.SUCCESS
+          ToasterType.SUCCESS,
         );
         break;
 
@@ -154,7 +154,7 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
       default:
         openToaster(
           `${sliceName} has been merged with ${args.libraryID} > ${args.sliceID}`,
-          ToasterType.SUCCESS
+          ToasterType.SUCCESS,
         );
         break;
     }
@@ -235,7 +235,7 @@ export const ConvertLegacySliceButton: FC<ConvertLegacySliceButtonProps> = ({
 const useIdenticalSlices = (
   slice: NonSharedSliceInSliceZone,
   sliceName: string,
-  localSharedSlices: ComponentUI[]
+  localSharedSlices: ComponentUI[],
 ) => {
   return useMemo<IdenticalSlice[]>(() => {
     const results: IdenticalSlice[] = [];
@@ -246,7 +246,7 @@ const useIdenticalSlices = (
       for (const variation of sharedSlice.model.variations) {
         const variationFields = getFieldMappingFingerprint(
           variation,
-          sharedSlice.model.name
+          sharedSlice.model.name,
         );
 
         if (

package/src/features/slicesTemplates/useSlicesTemplates.ts

@@ -22,7 +22,7 @@ async function getSlicesTemplates(): Promise<SliceTemplate[]> {
         Object.entries(template.screenshots).map(([key, blob]) => [
           key,
           URL.createObjectURL(blob),
-        ])
+        ]),
       ),
     }));
   } catch (e) {

package/src/hooks/useCurrentSlice.tsx

@@ -18,7 +18,7 @@ const useCurrentSlice = (): UseCurrentSliceRet => {
     slice: selectCurrentSlice(
       store,
       router.query.lib as string,
-      router.query.sliceName as string
+      router.query.sliceName as string,
     ),
   }));
 
@@ -35,7 +35,7 @@ const useCurrentSlice = (): UseCurrentSliceRet => {
   }
 
   const variation = slice.model.variations.find(
-    (variation) => variation.id === router.query.variation
+    (variation) => variation.id === router.query.variation,
   );
 
   if (!variation) {

package/src/hooks/useElementSize.ts

@@ -7,7 +7,7 @@ import {
 
 export function useElementSize<E extends Element>(
   callback: (size: ResizeObserverSize, element: E) => void,
-  deps: DependencyList
+  deps: DependencyList,
 ): RefCallback<E> {
   const resizeObserverRef = useRef<ResizeObserver>();
   return useCallback((element: E | null) => {

package/src/hooks/useModelStatus.ts

@@ -26,24 +26,27 @@ export interface ModelStatusInformation {
 
 function computeStatuses(
   models: LocalOrRemoteCustomType[],
-  userHasAccessToModels: boolean
+  userHasAccessToModels: boolean,
 ): { [sliceId: string]: ModelStatus };
 function computeStatuses(
   models: LocalOrRemoteSlice[],
-  userHasAccessToModels: boolean
+  userHasAccessToModels: boolean,
 ): { [sliceId: string]: ModelStatus };
 function computeStatuses(
   models: LocalOrRemoteModel[],
-  userHasAccessToModels: boolean
+  userHasAccessToModels: boolean,
 ) {
-  return models.reduce<{ [id: string]: ModelStatus }>((acc, model) => {
-    const { status } = computeModelStatus(model, userHasAccessToModels);
+  return models.reduce<{ [id: string]: ModelStatus }>(
+    (acc, model) => {
+      const { status } = computeModelStatus(model, userHasAccessToModels);
 
-    return {
-      ...acc,
-      [hasLocal(model) ? model.local.id : model.remote.id]: status,
-    };
-  }, {} as { [sliceId: string]: ModelStatus });
+      return {
+        ...acc,
+        [hasLocal(model) ? model.local.id : model.remote.id]: status,
+      };
+    },
+    {} as { [sliceId: string]: ModelStatus },
+  );
 }
 
 export const useModelStatus = ({

package/src/hooks/useRouteChange.tsx

@@ -36,7 +36,7 @@ export function useRouteChange(): RouteChange {
   const routeChange = useContext(RouteChangeContext);
   if (routeChange === undefined)
     throw new Error(
-      "useRouteChange must be used within a RouteChangeProvider."
+      "useRouteChange must be used within a RouteChangeProvider.",
     );
   return routeChange;
 }