diff --git a/.gitignore b/.gitignore index 94433c4..d317839 100644 --- a/.gitignore +++ b/.gitignore @@ -40,5 +40,3 @@ npm-debug.log* **/public/fallback-*.js # Sentry Auth Token .sentryclirc - -/src/migration \ No newline at end of file diff --git a/package.json b/package.json index fcbbbc6..7ee7aa1 100644 --- a/package.json +++ b/package.json @@ -2,8 +2,14 @@ "name": "json-crack", "private": true, "version": "0.0.0", - "author": "https://github.com/AykutSarac", + "author": { + "name": "JSON Crack", + "email": "contact@jsoncrack.com" + }, "homepage": "https://jsoncrack.com", + "bugs": { + "url": "https://github.com/AykutSarac/jsoncrack.com/issues" + }, "scripts": { "dev": "next dev", "build": "next build", diff --git a/src/constants/data.ts b/src/constants/data.ts deleted file mode 100644 index e3ebc9b..0000000 --- a/src/constants/data.ts +++ /dev/null @@ -1,36 +0,0 @@ -// Example taken from https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json -const sampleJson = Object.freeze({ - squadName: "Super hero squad", - homeTown: "Metro City", - formed: 2016, - secretBase: "Super tower", - active: true, - members: [ - { - name: "Molecule Man", - age: 29, - secretIdentity: "Dan Jukes", - powers: ["Radiation resistance", "Turning tiny", "Radiation blast"], - }, - { - name: "Madame Uppercut", - age: 39, - secretIdentity: "Jane Wilson", - powers: ["Million tonne punch", "Damage resistance", "Superhuman reflexes"], - }, - { - name: "Eternal Flame", - age: 1000000, - secretIdentity: "Unknown", - powers: [ - "Immortality", - "Heat Immunity", - "Inferno", - "Teleportation", - "Interdimensional travel", - ], - }, - ], -}); - -export const defaultJson = JSON.stringify(sampleJson, null, 2); diff --git a/src/constants/landing.ts b/src/constants/landing.ts deleted file mode 100644 index cd77061..0000000 --- a/src/constants/landing.ts +++ /dev/null @@ -1,34 +0,0 @@ -export const images = Object.freeze([ - { - id: 1, - alt: "⚡️ Clean and Intuitive Interface designed for productivity and ease of use.", - }, - { - id: 2, - alt: "🔎 Enhanced Search Experience, with the ability to focus on node as you navigate through the data.", - }, - { - id: 3, - alt: "✍️ Understand your data in less time, modify the data directly on the graph.", - }, - { - id: 4, - alt: "📋 Download graphs as images, with options to customize the image quality and background color.", - }, - { - id: 5, - alt: "🎨 Customize the graph appearance, with options to change the node and edge colors, and the graph layout. Match the graph to your brand colors.", - }, - { - id: 6, - alt: "🖍️ Compare data on the graph, with the ability to highlight the differences between two datasets.", - }, - { - id: 7, - alt: "🤖 Filter and transform your data quickly and securely using the AI powered assistant.", - }, - { - id: 8, - alt: "🌓 Who doesn't love dark mode? A sleek and modern design that is easy on the eyes.", - }, -]); diff --git a/src/containers/Editor/BottomBar.tsx b/src/containers/Editor/components/BottomBar.tsx similarity index 91% rename from src/containers/Editor/BottomBar.tsx rename to src/containers/Editor/components/BottomBar.tsx index 535eaf8..7303f3c 100644 --- a/src/containers/Editor/BottomBar.tsx +++ b/src/containers/Editor/components/BottomBar.tsx @@ -1,8 +1,9 @@ import React from "react"; +import Link from "next/link"; import { Flex, Popover, Text } from "@mantine/core"; import styled from "styled-components"; import { event as gaEvent } from "nextjs-google-analytics"; -import { AiOutlineLink, AiOutlineLock, AiOutlineUnlock } from "react-icons/ai"; +import { AiOutlineLock, AiOutlineUnlock } from "react-icons/ai"; import { BiSolidDockLeft } from "react-icons/bi"; import { VscCheck, @@ -13,7 +14,7 @@ import { VscSync, VscSyncIgnored, } from "react-icons/vsc"; -import useGraph from "src/modules/GraphView/stores/useGraph"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; import useConfig from "src/store/useConfig"; import useFile from "src/store/useFile"; import useModal from "src/store/useModal"; @@ -114,7 +115,6 @@ export const BottomBar = () => { - {fileName && ( setVisible("cloud")(true)}> @@ -149,12 +149,6 @@ export const BottomBar = () => { {isPrivate ? "Private" : "Public"} )} - {isAuthenticated && ( - setVisible("notice")(true)}> - - Share - - )} { toggleLiveTransform(!liveTransformEnabled); @@ -174,10 +168,12 @@ export const BottomBar = () => { Nodes: {nodeCount} - setVisible("review")(true)}> - - Feedback - + + + + Feedback + + ); diff --git a/src/containers/Editor/FullscreenDropzone.tsx b/src/containers/Editor/components/FullscreenDropzone.tsx similarity index 100% rename from src/containers/Editor/FullscreenDropzone.tsx rename to src/containers/Editor/components/FullscreenDropzone.tsx diff --git a/src/containers/Editor/LiveEditor/index.tsx b/src/containers/Editor/components/LiveEditor.tsx similarity index 86% rename from src/containers/Editor/LiveEditor/index.tsx rename to src/containers/Editor/components/LiveEditor.tsx index e907271..183bdd5 100644 --- a/src/containers/Editor/LiveEditor/index.tsx +++ b/src/containers/Editor/components/LiveEditor.tsx @@ -1,8 +1,8 @@ import React from "react"; import styled from "styled-components"; +import { GraphView } from "src/containers/Editor/components/views/GraphView"; +import { TreeView } from "src/containers/Editor/components/views/TreeView"; import { ViewMode } from "src/enums/viewMode.enum"; -import { GraphView } from "src/modules/GraphView"; -import { TreeView } from "src/modules/TreeView"; import useConfig from "src/store/useConfig"; const StyledLiveEditor = styled.div` diff --git a/src/containers/Editor/TextEditor/index.tsx b/src/containers/Editor/components/TextEditor.tsx similarity index 100% rename from src/containers/Editor/TextEditor/index.tsx rename to src/containers/Editor/components/TextEditor.tsx diff --git a/src/modules/GraphView/CustomEdge/index.tsx b/src/containers/Editor/components/views/GraphView/CustomEdge/index.tsx similarity index 100% rename from src/modules/GraphView/CustomEdge/index.tsx rename to src/containers/Editor/components/views/GraphView/CustomEdge/index.tsx diff --git a/src/modules/GraphView/CustomNode/ObjectNode.tsx b/src/containers/Editor/components/views/GraphView/CustomNode/ObjectNode.tsx similarity index 92% rename from src/modules/GraphView/CustomNode/ObjectNode.tsx rename to src/containers/Editor/components/views/GraphView/CustomNode/ObjectNode.tsx index 049f24d..64e8c85 100644 --- a/src/modules/GraphView/CustomNode/ObjectNode.tsx +++ b/src/containers/Editor/components/views/GraphView/CustomNode/ObjectNode.tsx @@ -1,5 +1,5 @@ import React from "react"; -import type { CustomNodeProps } from "src/modules/GraphView/CustomNode"; +import type { CustomNodeProps } from "src/containers/Editor/components/views/GraphView/CustomNode"; import { TextRenderer } from "./TextRenderer"; import * as Styled from "./styles"; diff --git a/src/modules/GraphView/CustomNode/TextNode.tsx b/src/containers/Editor/components/views/GraphView/CustomNode/TextNode.tsx similarity index 92% rename from src/modules/GraphView/CustomNode/TextNode.tsx rename to src/containers/Editor/components/views/GraphView/CustomNode/TextNode.tsx index 8fda850..91c48f6 100644 --- a/src/modules/GraphView/CustomNode/TextNode.tsx +++ b/src/containers/Editor/components/views/GraphView/CustomNode/TextNode.tsx @@ -1,10 +1,10 @@ import React from "react"; import styled from "styled-components"; import { MdLink, MdLinkOff } from "react-icons/md"; +import type { CustomNodeProps } from "src/containers/Editor/components/views/GraphView/CustomNode"; +import { isContentImage } from "src/containers/Editor/components/views/GraphView/lib/utils/calculateNodeSize"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; import useToggleHide from "src/hooks/useToggleHide"; -import type { CustomNodeProps } from "src/modules/GraphView/CustomNode"; -import { isContentImage } from "src/modules/GraphView/lib/utils/calculateNodeSize"; -import useGraph from "src/modules/GraphView/stores/useGraph"; import useConfig from "src/store/useConfig"; import { TextRenderer } from "./TextRenderer"; import * as Styled from "./styles"; diff --git a/src/modules/GraphView/CustomNode/TextRenderer.tsx b/src/containers/Editor/components/views/GraphView/CustomNode/TextRenderer.tsx similarity index 100% rename from src/modules/GraphView/CustomNode/TextRenderer.tsx rename to src/containers/Editor/components/views/GraphView/CustomNode/TextRenderer.tsx diff --git a/src/modules/GraphView/CustomNode/index.tsx b/src/containers/Editor/components/views/GraphView/CustomNode/index.tsx similarity index 94% rename from src/modules/GraphView/CustomNode/index.tsx rename to src/containers/Editor/components/views/GraphView/CustomNode/index.tsx index 8fcff4c..05196d7 100644 --- a/src/modules/GraphView/CustomNode/index.tsx +++ b/src/containers/Editor/components/views/GraphView/CustomNode/index.tsx @@ -1,7 +1,7 @@ import React from "react"; import type { NodeProps } from "reaflow"; import { Node } from "reaflow"; -import useGraph from "src/modules/GraphView/stores/useGraph"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; import useModal from "src/store/useModal"; import type { NodeData } from "src/types/graph"; import { ObjectNode } from "./ObjectNode"; diff --git a/src/modules/GraphView/CustomNode/styles.tsx b/src/containers/Editor/components/views/GraphView/CustomNode/styles.tsx similarity index 100% rename from src/modules/GraphView/CustomNode/styles.tsx rename to src/containers/Editor/components/views/GraphView/CustomNode/styles.tsx diff --git a/src/modules/GraphView/NotSupported.tsx b/src/containers/Editor/components/views/GraphView/NotSupported.tsx similarity index 100% rename from src/modules/GraphView/NotSupported.tsx rename to src/containers/Editor/components/views/GraphView/NotSupported.tsx diff --git a/src/modules/GraphView/index.tsx b/src/containers/Editor/components/views/GraphView/index.tsx similarity index 97% rename from src/modules/GraphView/index.tsx rename to src/containers/Editor/components/views/GraphView/index.tsx index d5149ea..7809703 100644 --- a/src/modules/GraphView/index.tsx +++ b/src/containers/Editor/components/views/GraphView/index.tsx @@ -6,9 +6,9 @@ import { Space } from "react-zoomable-ui"; import { Canvas } from "reaflow"; import type { ElkRoot } from "reaflow/dist/layout/useLayout"; import { useLongPress } from "use-long-press"; +import { CustomNode } from "src/containers/Editor/components/views/GraphView/CustomNode"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; import useToggleHide from "src/hooks/useToggleHide"; -import { CustomNode } from "src/modules/GraphView/CustomNode"; -import useGraph from "src/modules/GraphView/stores/useGraph"; import useConfig from "src/store/useConfig"; import { CustomEdge } from "./CustomEdge"; import { NotSupported } from "./NotSupported"; diff --git a/src/modules/GraphView/lib/jsonParser.ts b/src/containers/Editor/components/views/GraphView/lib/jsonParser.ts similarity index 100% rename from src/modules/GraphView/lib/jsonParser.ts rename to src/containers/Editor/components/views/GraphView/lib/jsonParser.ts diff --git a/src/modules/GraphView/lib/utils/addEdgeToGraph.ts b/src/containers/Editor/components/views/GraphView/lib/utils/addEdgeToGraph.ts similarity index 100% rename from src/modules/GraphView/lib/utils/addEdgeToGraph.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/addEdgeToGraph.ts diff --git a/src/modules/GraphView/lib/utils/addNodeToGraph.ts b/src/containers/Editor/components/views/GraphView/lib/utils/addNodeToGraph.ts similarity index 75% rename from src/modules/GraphView/lib/utils/addNodeToGraph.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/addNodeToGraph.ts index 117f704..4e291dc 100644 --- a/src/modules/GraphView/lib/utils/addNodeToGraph.ts +++ b/src/containers/Editor/components/views/GraphView/lib/utils/addNodeToGraph.ts @@ -1,6 +1,6 @@ import type { NodeType } from "jsonc-parser"; -import type { Graph } from "src/modules/GraphView/lib/jsonParser"; -import { calculateNodeSize } from "src/modules/GraphView/lib/utils/calculateNodeSize"; +import type { Graph } from "src/containers/Editor/components/views/GraphView/lib/jsonParser"; +import { calculateNodeSize } from "src/containers/Editor/components/views/GraphView/lib/utils/calculateNodeSize"; type Props = { graph: Graph; diff --git a/src/modules/GraphView/lib/utils/calculateNodeSize.ts b/src/containers/Editor/components/views/GraphView/lib/utils/calculateNodeSize.ts similarity index 100% rename from src/modules/GraphView/lib/utils/calculateNodeSize.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/calculateNodeSize.ts diff --git a/src/modules/GraphView/lib/utils/getChildrenEdges.ts b/src/containers/Editor/components/views/GraphView/lib/utils/getChildrenEdges.ts similarity index 100% rename from src/modules/GraphView/lib/utils/getChildrenEdges.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/getChildrenEdges.ts diff --git a/src/modules/GraphView/lib/utils/getNodePath.ts b/src/containers/Editor/components/views/GraphView/lib/utils/getNodePath.ts similarity index 100% rename from src/modules/GraphView/lib/utils/getNodePath.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/getNodePath.ts diff --git a/src/modules/GraphView/lib/utils/getOutgoers.ts b/src/containers/Editor/components/views/GraphView/lib/utils/getOutgoers.ts similarity index 100% rename from src/modules/GraphView/lib/utils/getOutgoers.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/getOutgoers.ts diff --git a/src/modules/GraphView/lib/utils/traverse.ts b/src/containers/Editor/components/views/GraphView/lib/utils/traverse.ts similarity index 97% rename from src/modules/GraphView/lib/utils/traverse.ts rename to src/containers/Editor/components/views/GraphView/lib/utils/traverse.ts index 4077a4e..b66ff45 100644 --- a/src/modules/GraphView/lib/utils/traverse.ts +++ b/src/containers/Editor/components/views/GraphView/lib/utils/traverse.ts @@ -1,6 +1,9 @@ import type { Node, NodeType } from "jsonc-parser"; -import type { Graph, States } from "src/modules/GraphView/lib/jsonParser"; -import { calculateNodeSize } from "src/modules/GraphView/lib/utils/calculateNodeSize"; +import type { + Graph, + States, +} from "src/containers/Editor/components/views/GraphView/lib/jsonParser"; +import { calculateNodeSize } from "src/containers/Editor/components/views/GraphView/lib/utils/calculateNodeSize"; import { addEdgeToGraph } from "./addEdgeToGraph"; import { addNodeToGraph } from "./addNodeToGraph"; diff --git a/src/modules/GraphView/stores/useGraph.ts b/src/containers/Editor/components/views/GraphView/stores/useGraph.ts similarity index 95% rename from src/modules/GraphView/stores/useGraph.ts rename to src/containers/Editor/components/views/GraphView/stores/useGraph.ts index c0a62e9..938712e 100644 --- a/src/modules/GraphView/stores/useGraph.ts +++ b/src/containers/Editor/components/views/GraphView/stores/useGraph.ts @@ -1,11 +1,11 @@ import type { ViewPort } from "react-zoomable-ui/dist/ViewPort"; import type { CanvasDirection } from "reaflow/dist/layout/elkLayout"; import { create } from "zustand"; -import { parser } from "src/modules/GraphView/lib/jsonParser"; -import { getChildrenEdges } from "src/modules/GraphView/lib/utils/getChildrenEdges"; -import { getOutgoers } from "src/modules/GraphView/lib/utils/getOutgoers"; +import { parser } from "src/containers/Editor/components/views/GraphView/lib/jsonParser"; +import { getChildrenEdges } from "src/containers/Editor/components/views/GraphView/lib/utils/getChildrenEdges"; +import { getOutgoers } from "src/containers/Editor/components/views/GraphView/lib/utils/getOutgoers"; import type { NodeData, EdgeData } from "src/types/graph"; -import useJson from "../../../store/useJson"; +import useJson from "../../../../../../store/useJson"; export interface Graph { viewPort: ViewPort | null; diff --git a/src/modules/TreeView/Label.tsx b/src/containers/Editor/components/views/TreeView/Label.tsx similarity index 100% rename from src/modules/TreeView/Label.tsx rename to src/containers/Editor/components/views/TreeView/Label.tsx diff --git a/src/modules/TreeView/Value.tsx b/src/containers/Editor/components/views/TreeView/Value.tsx similarity index 90% rename from src/modules/TreeView/Value.tsx rename to src/containers/Editor/components/views/TreeView/Value.tsx index 16acd39..e877f27 100644 --- a/src/modules/TreeView/Value.tsx +++ b/src/containers/Editor/components/views/TreeView/Value.tsx @@ -1,7 +1,7 @@ import React from "react"; import type { DefaultTheme } from "styled-components"; import { useTheme } from "styled-components"; -import { TextRenderer } from "src/modules/GraphView/CustomNode/TextRenderer"; +import { TextRenderer } from "src/containers/Editor/components/views/GraphView/CustomNode/TextRenderer"; type TextColorFn = { theme: DefaultTheme; diff --git a/src/modules/TreeView/index.tsx b/src/containers/Editor/components/views/TreeView/index.tsx similarity index 100% rename from src/modules/TreeView/index.tsx rename to src/containers/Editor/components/views/TreeView/index.tsx diff --git a/src/containers/Editor/index.tsx b/src/containers/Editor/index.tsx index 2b2bf83..2694b10 100644 --- a/src/containers/Editor/index.tsx +++ b/src/containers/Editor/index.tsx @@ -3,8 +3,8 @@ import dynamic from "next/dynamic"; import styled from "styled-components"; import { Allotment } from "allotment"; import "allotment/dist/style.css"; -import useGraph from "src/modules/GraphView/stores/useGraph"; -import { FullscreenDropzone } from "./FullscreenDropzone"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; +import { FullscreenDropzone } from "./components/FullscreenDropzone"; export const StyledEditor = styled(Allotment)` position: relative !important; @@ -17,11 +17,11 @@ export const StyledEditor = styled(Allotment)` } `; -const TextEditor = dynamic(() => import("src/containers/Editor/TextEditor"), { +const TextEditor = dynamic(() => import("src/containers/Editor/components/TextEditor"), { ssr: false, }); -const LiveEditor = dynamic(() => import("src/containers/Editor/LiveEditor"), { +const LiveEditor = dynamic(() => import("src/containers/Editor/components/LiveEditor"), { ssr: false, }); diff --git a/src/containers/Landing/FAQ.tsx b/src/containers/Landing/FAQ.tsx index a3c9f92..99fa44f 100644 --- a/src/containers/Landing/FAQ.tsx +++ b/src/containers/Landing/FAQ.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Container, Title, Accordion } from "@mantine/core"; -import Questions from "src/constants/faq.json"; +import Questions from "src/data/faq.json"; export const FAQ = () => { return ( diff --git a/src/containers/Modals/ClearModal/index.tsx b/src/containers/Modals/ClearModal/index.tsx index efb4f2d..ae57d11 100644 --- a/src/containers/Modals/ClearModal/index.tsx +++ b/src/containers/Modals/ClearModal/index.tsx @@ -2,7 +2,7 @@ import React from "react"; import { useRouter } from "next/router"; import type { ModalProps } from "@mantine/core"; import { Modal, Group, Button, Text, Divider } from "@mantine/core"; -import { documentSvc } from "src/services/document.service"; +import { documentSvc } from "src/lib/api/document.service"; import useJson from "src/store/useJson"; export const ClearModal = ({ opened, onClose }: ModalProps) => { diff --git a/src/containers/Modals/CloudModal/index.tsx b/src/containers/Modals/CloudModal/index.tsx index 3764ffb..671f158 100644 --- a/src/containers/Modals/CloudModal/index.tsx +++ b/src/containers/Modals/CloudModal/index.tsx @@ -29,7 +29,7 @@ import { LuDownload } from "react-icons/lu"; import { SlOptionsVertical } from "react-icons/sl"; import { VscAdd, VscWarning } from "react-icons/vsc"; import type { FileFormat } from "src/enums/file.enum"; -import { documentSvc } from "src/services/document.service"; +import { documentSvc } from "src/lib/api/document.service"; import type { File } from "src/store/useFile"; import useFile from "src/store/useFile"; import useModal from "src/store/useModal"; @@ -152,7 +152,9 @@ export const CloudModal = ({ opened, onClose }: ModalProps) => { {element.name} - {dayjs(element.updated_at).format("DD MMM YYYY")} + + {dayjs(element.updated_at).fromNow()} + e.stopPropagation()}> @@ -219,14 +221,7 @@ export const CloudModal = ({ opened, onClose }: ModalProps) => { /> - - - - Format - Name - Last opened date - - +
{rows}
 diff --git a/src/containers/Modals/NodeModal/index.tsx b/src/containers/Modals/NodeModal/index.tsx index 4587fb6..ef3d671 100644 --- a/src/containers/Modals/NodeModal/index.tsx +++ b/src/containers/Modals/NodeModal/index.tsx @@ -4,7 +4,7 @@ import { Modal, Stack, Text, ScrollArea, Button } from "@mantine/core"; import { CodeHighlight } from "@mantine/code-highlight"; import { event as gaEvent } from "nextjs-google-analytics"; import { VscLock } from "react-icons/vsc"; -import useGraph from "src/modules/GraphView/stores/useGraph"; +import useGraph from "src/containers/Editor/components/views/GraphView/stores/useGraph"; import useModal from "src/store/useModal"; const dataToString = (data: any) => { diff --git a/src/containers/Modals/ReviewModal/index.tsx b/src/containers/Modals/ReviewModal/index.tsx deleted file mode 100644 index bf79f80..0000000 --- a/src/containers/Modals/ReviewModal/index.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import React from "react"; -import type { ModalProps } from "@mantine/core"; -import { Button, Modal, Rating, Text, Textarea } from "@mantine/core"; -import { toast } from "react-hot-toast"; -import { supabase } from "src/lib/api/supabase"; - -export const ReviewModal = ({ opened, onClose }: ModalProps) => { - const [stars, setStars] = React.useState(0); - const [review, setReview] = React.useState(""); - - return ( - { - onClose(); - setStars(0); - setReview(""); - }} - centered - > -
{ - e.preventDefault(); - if (stars === 0 && !review.length) return onClose(); - supabase - .from("reviews") - .insert({ stars, review }) - .then(({ error }) => { - if (error) return toast.error(error.message); - toast.success("Thank you for your feedback!"); - }); - onClose(); - }} - > - How was your experience? - -