diff --git a/src/components/EditorHeader/Modal/Modal.jsx b/src/components/EditorHeader/Modal/Modal.jsx
index 649117c..f9a8054 100644
--- a/src/components/EditorHeader/Modal/Modal.jsx
+++ b/src/components/EditorHeader/Modal/Modal.jsx
@@ -336,7 +336,7 @@ export default function Modal({
case MODAL.LANGUAGE:
return ;
case MODAL.SHARE:
- return ;
+ return ;
default:
return <>>;
}
diff --git a/src/components/EditorHeader/Modal/Share.jsx b/src/components/EditorHeader/Modal/Share.jsx
index 3731a3e..546e3bb 100644
--- a/src/components/EditorHeader/Modal/Share.jsx
+++ b/src/components/EditorHeader/Modal/Share.jsx
@@ -13,8 +13,9 @@ import {
} from "../../../hooks";
import { databases } from "../../../data/databases";
import { octokit } from "../../../data/octokit";
+import { MODAL } from "../../../data/constants";
-export default function Share({ title }) {
+export default function Share({ title, setModal }) {
const { t } = useTranslation();
const { gistId, setGistId } = useContext(IdContext);
const [loading, setLoading] = useState(true);
@@ -51,6 +52,21 @@ export default function Share({ title }) {
transform,
]);
+ const unshare = useCallback(async () => {
+ try {
+ await octokit.request(`DELETE /gists/${gistId}`, {
+ gist_id: gistId,
+ headers: {
+ "X-GitHub-Api-Version": "2022-11-28",
+ },
+ });
+ setGistId("");
+ setModal(MODAL.NONE);
+ } catch (e) {
+ console.error(e);
+ }
+ }, [gistId, setGistId, setModal]);
+
const updateGist = useCallback(async () => {
setLoading(true);
try {
@@ -136,17 +152,16 @@ export default function Share({ title }) {
- }
- onClick={copyLink}
- >
+
+
{t("share_info")}
+
+
+ } onClick={copyLink}>
{t("copy_link")}
-
-
{t("share_info")}
);
}
diff --git a/src/components/Workspace.jsx b/src/components/Workspace.jsx
index ce9a4f6..1797851 100644
--- a/src/components/Workspace.jsx
+++ b/src/components/Workspace.jsx
@@ -65,6 +65,8 @@ export default function WorkSpace() {
};
const save = useCallback(async () => {
+ if (saveState !== State.SAVING) return;
+
const name = window.name.split(" ");
const op = name[0];
const saveAsDiagram = window.name === "" || op === "d" || op === "lt";
@@ -72,10 +74,7 @@ export default function WorkSpace() {
if (saveAsDiagram) {
searchParams.delete("shareId");
setSearchParams(searchParams);
- if (
- (id === 0 && window.name === "") ||
- window.name.split(" ")[0] === "lt"
- ) {
+ if ((id === 0 && window.name === "") || op === "lt") {
await db.diagrams
.add({
database: database,
@@ -162,6 +161,7 @@ export default function WorkSpace() {
enums,
gistId,
loadedFromGistId,
+ saveState
]);
const load = useCallback(async () => {
@@ -283,52 +283,7 @@ export default function WorkSpace() {
});
};
- if (window.name === "") {
- loadLatestDiagram();
- } else {
- const name = window.name.split(" ");
- const op = name[0];
- const id = parseInt(name[1]);
- switch (op) {
- case "d": {
- loadDiagram(id);
- break;
- }
- case "t":
- case "lt": {
- loadTemplate(id);
- break;
- }
- default:
- break;
- }
- }
- }, [
- setTransform,
- setRedoStack,
- setUndoStack,
- setRelationships,
- setTables,
- setAreas,
- setNotes,
- setTypes,
- setTasks,
- setDatabase,
- database,
- setEnums,
- selectedDb,
- ]);
-
- const loadFromGist = useCallback(
- async (shareId) => {
- const existingDiagram = await db.diagrams.get({
- loadedFromGistId: shareId,
- });
- if (existingDiagram) {
- window.name = "d " + existingDiagram.id;
- } else {
- window.name = "";
- }
+ const loadFromGist = async (shareId) => {
try {
const res = await octokit.request(`GET /gists/${shareId}`, {
gist_id: shareId,
@@ -358,21 +313,62 @@ export default function WorkSpace() {
console.log(e);
setSaveState(State.FAILED_TO_LOAD);
}
- },
- [
- setAreas,
- setDatabase,
- setEnums,
- setNotes,
- setRelationships,
- setTables,
- setTypes,
- setTransform,
- setRedoStack,
- setUndoStack,
- setSaveState,
- ],
- );
+ };
+
+ const shareId = searchParams.get("shareId");
+ if (shareId) {
+ const existingDiagram = await db.diagrams.get({
+ loadedFromGistId: shareId,
+ });
+
+ if (existingDiagram) {
+ window.name = "d " + existingDiagram.id;
+ setId(existingDiagram.id);
+ } else {
+ window.name = "";
+ setId(0);
+ }
+ await loadFromGist(shareId);
+ return;
+ }
+
+ if (window.name === "") {
+ await loadLatestDiagram();
+ } else {
+ const name = window.name.split(" ");
+ const op = name[0];
+ const id = parseInt(name[1]);
+ switch (op) {
+ case "d": {
+ await loadDiagram(id);
+ break;
+ }
+ case "t":
+ case "lt": {
+ await loadTemplate(id);
+ break;
+ }
+ default:
+ break;
+ }
+ }
+ }, [
+ setTransform,
+ setRedoStack,
+ setUndoStack,
+ setRelationships,
+ setTables,
+ setAreas,
+ setNotes,
+ setTypes,
+ setTasks,
+ setDatabase,
+ database,
+ setEnums,
+ selectedDb,
+ setSaveState,
+ searchParams,
+ ]);
useEffect(() => {
if (
@@ -399,31 +395,19 @@ export default function WorkSpace() {
tasks?.length,
transform.zoom,
title,
+ gistId,
setSaveState,
]);
useEffect(() => {
- if (gistId && gistId !== "") {
- setSaveState(State.SAVING);
- }
- }, [gistId, setSaveState]);
-
- useEffect(() => {
- if (saveState !== State.SAVING) return;
-
save();
- }, [id, gistId, saveState, save]);
+ }, [saveState, save]);
useEffect(() => {
document.title = "Editor | drawDB";
- const shareId = searchParams.get("shareId");
- if (shareId) {
- loadFromGist(shareId);
- } else {
- load();
- }
- }, [load, searchParams, loadFromGist]);
+ load();
+ }, [load]);
return (
diff --git a/src/context/SaveStateContext.jsx b/src/context/SaveStateContext.jsx
index 791c114..eea3cf6 100644
--- a/src/context/SaveStateContext.jsx
+++ b/src/context/SaveStateContext.jsx
@@ -1,7 +1,7 @@
import { createContext, useState } from "react";
import { State } from "../data/constants";
-export const SaveStateContext = createContext(null);
+export const SaveStateContext = createContext(State.NONE);
export default function SaveStateContextProvider({ children }) {
const [saveState, setSaveState] = useState(State.NONE);
diff --git a/src/i18n/locales/en.js b/src/i18n/locales/en.js
index cebfac6..6251531 100644
--- a/src/i18n/locales/en.js
+++ b/src/i18n/locales/en.js
@@ -237,6 +237,7 @@ const en = {
didnt_find_diagram: "Oops! Didn't find the diagram.",
unsigned: "Unsigned",
share: "Share",
+ unshare: "Unshare",
copy_link: "Copy link",
readme: "README",
failed_to_load: "Failed to load. Make sure the link is correct.",