add auth for get json

src/components/Footer/index.tsx

@@ -1,8 +1,8 @@
+import Link from "next/link";
 import { FaGithub, FaLinkedin, FaTwitter } from "react-icons/fa";
 import styled from "styled-components";
 import pkg from "../../../package.json";
 
-
 export const StyledFooter = styled.footer`
   display: flex;
   flex-direction: row;
@@ -21,7 +21,6 @@ export const StyledFooterText = styled.p`
   color: #b4b4b4;
 `;
 
-
 export const StyledNavLink = styled.a`
   display: flex;
   justify-content: center;
@@ -44,7 +43,11 @@ export const StyledIconLinks = styled.div`
 export const Footer = () => (
   <StyledFooter>
     <StyledFooterText>
-      <img width="120" src="assets/icon.png" alt="icon" loading="lazy" />
+      <Link href="/">
+        <a>
+          <img width="120" src="assets/icon.png" alt="icon" loading="lazy" />
+        </a>
+      </Link>
       <span>
         © {new Date().getFullYear()} JSON Crack - {pkg.version}
       </span>
@@ -78,4 +81,4 @@ export const Footer = () => (
       </StyledNavLink>
     </StyledIconLinks>
   </StyledFooter>
-);
+);

src/containers/Modals/CloudModal/index.tsx

@@ -155,7 +155,7 @@ export const CloudModal: React.FC<ModalProps> = ({ visible, setVisible }) => {
   const { isReady, query } = useRouter();
 
   const { data, isFetching, refetch } = useQuery(["allJson", query], () => getAllJson(), {
-    enabled: isReady
+    enabled: isReady && visible
   });
 
   return (

src/pages/docs.tsx

@@ -46,6 +46,7 @@ const StyledContentBody = styled.div`
 
 const StyledHighlight = styled.span<{ link?: boolean; alert?: boolean }>`
   text-align: left;
+  white-space: nowrap;
   color: ${({ theme, link, alert }) =>
     alert ? theme.DANGER : link ? theme.BLURPLE : theme.TEXT_POSITIVE};
   background: ${({ theme }) => theme.BACKGROUND_TERTIARY};

src/store/useJson.tsx

@@ -54,7 +54,9 @@ const useJson = create<JsonStates & JsonActions>()((set, get) => ({
         toast.error("Failed to fetch JSON from URL!");
       }
     } else if (jsonId) {
-      const { data, errors } = await altogic.endpoint.get(`json/${jsonId}`);
+      const { data, errors } = await altogic.endpoint.get(`json/${jsonId}`, undefined, {
+        userid: altogic.auth.getUser()?._id,
+      });
 
       if (!errors) {
         const decompressedData = decompressFromBase64(data.json);