fix: change format error

src/components/GoogleAnalytics/index.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import Script from "next/script";
-import * as gtag from "src/utils/gtag";
 
 const isDevelopment = process.env.NODE_ENV === "development";
+const GA_TRACKING_ID = process.env.NEXT_PUBLIC_GA_ID;
 
 export const GoogleAnalytics: React.FC = () => {
   if (isDevelopment) return null;
@@ -11,7 +11,7 @@ export const GoogleAnalytics: React.FC = () => {
     <>
       <Script
         strategy="afterInteractive"
-        src={`https://www.googletagmanager.com/gtag/js?id=${gtag.GA_TRACKING_ID}`}
+        src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
       />
       <Script
         id="gtag-init"
@@ -21,7 +21,7 @@ export const GoogleAnalytics: React.FC = () => {
             window.dataLayer = window.dataLayer || [];
             function gtag(){dataLayer.push(arguments);}
             gtag('js', new Date());
-            gtag('config', '${gtag.GA_TRACKING_ID}', {
+            gtag('config', '${GA_TRACKING_ID}', {
               page_path: window.location.pathname,
             });
           `,

src/pages/_app.tsx

@@ -1,6 +1,5 @@
 import React from "react";
 import type { AppProps } from "next/app";
-import { useRouter } from "next/router";
 import { ThemeProvider } from "styled-components";
 import { MantineProvider } from "@mantine/core";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
@@ -11,7 +10,6 @@ import GlobalStyle from "src/constants/globalStyle";
 import { lightTheme } from "src/constants/theme";
 import { ExternalMode } from "src/layout/DevMode";
 import { ModalController } from "src/layout/ModalController";
-import * as gtag from "src/utils/gtag";
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -23,17 +21,9 @@ const queryClient = new QueryClient({
 });
 
 function JsonCrack({ Component, pageProps }: AppProps) {
-  const router = useRouter();
   const [isReady, setReady] = React.useState(false);
 
-  React.useEffect(() => {
+  React.useEffect(() => setReady(true), []);
-    const handleRouteChange = (url: string) => gtag.pageview(url);
-    router.events.on("routeChangeComplete", handleRouteChange);
-    setReady(true);
-    return () => {
-      router.events.off("routeChangeComplete", handleRouteChange);
-    };
-  }, [router.events]);
 
   if (isReady)
     return (

src/store/useFile.ts

@@ -98,14 +98,14 @@ const useFile = create<FileStates & JsonActions>()((set, get) => ({
   getHasChanges: () => get().hasChanges,
   setFormat: async format => {
     try {
-      const contentJson = await contentToJson(get().contents, get().format);
+      const prevFormat = get().format;
+      set({ format });
+      const contentJson = await contentToJson(get().contents, prevFormat);
       const jsonContent = await jsonToContent(JSON.stringify(contentJson, null, 2), format);
       get().setContents({ contents: jsonContent, hasChanges: false });
     } catch (error) {
       get().clear();
       console.info("The content was unable to be converted, so it was cleared instead.");
-    } finally {
-      set({ format });
     }
   },
   setContents: async ({ contents, hasChanges = true, skipUpdate = false }) => {

src/typings/global.d.ts

@@ -1,5 +1,3 @@
 interface Window {
   _bsa: any;
-  gtag: (...args: any[]) => void;
-  dataLayer: Record<string, any>;
 }

src/utils/gtag.ts

@@ -1,17 +0,0 @@
-export const GA_TRACKING_ID = process.env.NEXT_PUBLIC_GA_ID;
-
-// https://developers.google.com/analytics/devguides/collection/gtagjs/pages
-export const pageview = (url: string) => {
-  window.gtag("config", GA_TRACKING_ID, {
-    page_path: url,
-  });
-};
-
-// https://developers.google.com/analytics/devguides/collection/gtagjs/events
-export const event = ({ action, category, label, value }) => {
-  window.gtag("event", action, {
-    event_category: category,
-    event_label: label,
-    value: value,
-  });
-};