Skip to content

Commit 881768b

Browse files
1ilit1ilit
authored
Merge pull request #302 from drawdb-io/unshare
Ushare a diagram
2 parents ce85bb6 + a344e85 commit 881768b

File tree

5 files changed

+89
-89
lines changed

5 files changed

+89
-89
lines changed

‎src/components/EditorHeader/Modal/Modal.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -336,7 +336,7 @@ export default function Modal({
336336
case MODAL.LANGUAGE:
337337
return <Language />;
338338
case MODAL.SHARE:
339-
return <Share title={title} />;
339+
return <Share title={title} setModal={setModal} />;
340340
default:
341341
return <></>;
342342
}

‎src/components/EditorHeader/Modal/Share.jsx‎

Lines changed: 24 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,9 @@ import {
1313
} from "../../../hooks";
1414
import { databases } from "../../../data/databases";
1515
import { octokit } from "../../../data/octokit";
16+
import { MODAL } from "../../../data/constants";
1617

17-
export default function Share({ title }) {
18+
export default function Share({ title, setModal }) {
1819
const { t } = useTranslation();
1920
const { gistId, setGistId } = useContext(IdContext);
2021
const [loading, setLoading] = useState(true);
@@ -51,6 +52,21 @@ export default function Share({ title }) {
5152
transform,
5253
]);
5354

55+
const unshare = useCallback(async () => {
56+
try {
57+
await octokit.request(`DELETE /gists/${gistId}`, {
58+
gist_id: gistId,
59+
headers: {
60+
"X-GitHub-Api-Version": "2022-11-28",
61+
},
62+
});
63+
setGistId("");
64+
setModal(MODAL.NONE);
65+
} catch (e) {
66+
console.error(e);
67+
}
68+
}, [gistId, setGistId, setModal]);
69+
5470
const updateGist = useCallback(async () => {
5571
setLoading(true);
5672
try {
@@ -136,17 +152,16 @@ export default function Share({ title }) {
136152
<div>
137153
<div className="flex gap-3">
138154
<Input value={url} size="large" />
139-
<Button
140-
size="large"
141-
theme="solid"
142-
icon={<IconLink />}
143-
onClick={copyLink}
144-
>
155+
</div>
156+
<div className="text-xs mt-2">{t("share_info")}</div>
157+
<div className="flex gap-2 mt-3">
158+
<Button block onClick={unshare}>
159+
{t("unshare")}
160+
</Button>
161+
<Button block theme="solid" icon={<IconLink />} onClick={copyLink}>
145162
{t("copy_link")}
146163
</Button>
147164
</div>
148-
<hr className="opacity-20 mt-3 mb-1" />
149-
<div className="text-xs">{t("share_info")}</div>
150165
</div>
151166
);
152167
}

‎src/components/Workspace.jsx‎

Lines changed: 62 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -65,17 +65,16 @@ export default function WorkSpace() {
6565
};
6666

6767
const save = useCallback(async () => {
68+
if (saveState !== State.SAVING) return;
69+
6870
const name = window.name.split(" ");
6971
const op = name[0];
7072
const saveAsDiagram = window.name === "" || op === "d" || op === "lt";
7173

7274
if (saveAsDiagram) {
7375
searchParams.delete("shareId");
7476
setSearchParams(searchParams);
75-
if (
76-
(id === 0 && window.name === "") ||
77-
window.name.split(" ")[0] === "lt"
78-
) {
77+
if ((id === 0 && window.name === "") || op === "lt") {
7978
await db.diagrams
8079
.add({
8180
database: database,
@@ -162,6 +161,7 @@ export default function WorkSpace() {
162161
enums,
163162
gistId,
164163
loadedFromGistId,
164+
saveState
165165
]);
166166

167167
const load = useCallback(async () => {
@@ -283,20 +283,69 @@ export default function WorkSpace() {
283283
});
284284
};
285285

286+
const loadFromGist = async (shareId) => {
287+
try {
288+
const res = await octokit.request(`GET /gists/${shareId}`, {
289+
gist_id: shareId,
290+
headers: {
291+
"X-GitHub-Api-Version": "2022-11-28",
292+
},
293+
});
294+
const diagramSrc = res.data.files["share.json"].content;
295+
const d = JSON.parse(diagramSrc);
296+
setUndoStack([]);
297+
setRedoStack([]);
298+
setLoadedFromGistId(shareId);
299+
setDatabase(d.database);
300+
setTitle(d.title);
301+
setTables(d.tables);
302+
setRelationships(d.relationships);
303+
setNotes(d.notes);
304+
setAreas(d.subjectAreas);
305+
setTransform(d.transform);
306+
if (databases[d.database].hasTypes) {
307+
setTypes(d.types ?? []);
308+
}
309+
if (databases[d.database].hasEnums) {
310+
setEnums(d.enums ?? []);
311+
}
312+
} catch (e) {
313+
console.log(e);
314+
setSaveState(State.FAILED_TO_LOAD);
315+
}
316+
};
317+
318+
const shareId = searchParams.get("shareId");
319+
if (shareId) {
320+
const existingDiagram = await db.diagrams.get({
321+
loadedFromGistId: shareId,
322+
});
323+
324+
if (existingDiagram) {
325+
window.name = "d " + existingDiagram.id;
326+
setId(existingDiagram.id);
327+
} else {
328+
window.name = "";
329+
setId(0);
330+
}
331+
await loadFromGist(shareId);
332+
return;
333+
}
334+
286335
if (window.name === "") {
287-
loadLatestDiagram();
336+
await loadLatestDiagram();
288337
} else {
289338
const name = window.name.split(" ");
290339
const op = name[0];
291340
const id = parseInt(name[1]);
292341
switch (op) {
293342
case "d": {
294-
loadDiagram(id);
343+
await loadDiagram(id);
295344
break;
296345
}
297346
case "t":
298347
case "lt": {
299-
loadTemplate(id);
348+
await loadTemplate(id);
300349
break;
301350
}
302351
default:
@@ -317,63 +366,10 @@ export default function WorkSpace() {
317366
database,
318367
setEnums,
319368
selectedDb,
369+
setSaveState,
370+
searchParams,
320371
]);
321372

322-
const loadFromGist = useCallback(
323-
async (shareId) => {
324-
const existingDiagram = await db.diagrams.get({
325-
loadedFromGistId: shareId,
326-
});
327-
if (existingDiagram) {
328-
window.name = "d " + existingDiagram.id;
329-
} else {
330-
window.name = "";
331-
}
332-
try {
333-
const res = await octokit.request(`GET /gists/${shareId}`, {
334-
gist_id: shareId,
335-
headers: {
336-
"X-GitHub-Api-Version": "2022-11-28",
337-
},
338-
});
339-
const diagramSrc = res.data.files["share.json"].content;
340-
const d = JSON.parse(diagramSrc);
341-
setUndoStack([]);
342-
setRedoStack([]);
343-
setLoadedFromGistId(shareId);
344-
setDatabase(d.database);
345-
setTitle(d.title);
346-
setTables(d.tables);
347-
setRelationships(d.relationships);
348-
setNotes(d.notes);
349-
setAreas(d.subjectAreas);
350-
setTransform(d.transform);
351-
if (databases[d.database].hasTypes) {
352-
setTypes(d.types ?? []);
353-
}
354-
if (databases[d.database].hasEnums) {
355-
setEnums(d.enums ?? []);
356-
}
357-
} catch (e) {
358-
console.log(e);
359-
setSaveState(State.FAILED_TO_LOAD);
360-
}
361-
},
362-
[
363-
setAreas,
364-
setDatabase,
365-
setEnums,
366-
setNotes,
367-
setRelationships,
368-
setTables,
369-
setTypes,
370-
setTransform,
371-
setRedoStack,
372-
setUndoStack,
373-
setSaveState,
374-
],
375-
);
376-
377373
useEffect(() => {
378374
if (
379375
tables?.length === 0 &&
@@ -399,31 +395,19 @@ export default function WorkSpace() {
399395
tasks?.length,
400396
transform.zoom,
401397
title,
398+
gistId,
402399
setSaveState,
403400
]);
404401

405402
useEffect(() => {
406-
if (gistId && gistId !== "") {
407-
setSaveState(State.SAVING);
408-
}
409-
}, [gistId, setSaveState]);
410-
411-
useEffect(() => {
412-
if (saveState !== State.SAVING) return;
413-
414403
save();
415-
}, [id, gistId, saveState, save]);
404+
}, [saveState, save]);
416405

417406
useEffect(() => {
418407
document.title = "Editor | drawDB";
419408

420-
const shareId = searchParams.get("shareId");
421-
if (shareId) {
422-
loadFromGist(shareId);
423-
} else {
424-
load();
425-
}
426-
}, [load, searchParams, loadFromGist]);
409+
load();
410+
}, [load]);
427411

428412
return (
429413
<div className="h-full flex flex-col overflow-hidden theme">

‎src/context/SaveStateContext.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { createContext, useState } from "react";
22
import { State } from "../data/constants";
33

4-
export const SaveStateContext = createContext(null);
4+
export const SaveStateContext = createContext(State.NONE);
55

66
export default function SaveStateContextProvider({ children }) {
77
const [saveState, setSaveState] = useState(State.NONE);

‎src/i18n/locales/en.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -237,6 +237,7 @@ const en = {
237237
didnt_find_diagram: "Oops! Didn't find the diagram.",
238238
unsigned: "Unsigned",
239239
share: "Share",
240+
unshare: "Unshare",
240241
copy_link: "Copy link",
241242
readme: "README",
242243
failed_to_load: "Failed to load. Make sure the link is correct.",

0 commit comments

Comments
 (0)