Clean up pages
This commit is contained in:
1ilit
parent
83985ba188
commit
639518e3bf
48
src/data/shortcuts.js
Normal file
48
src/data/shortcuts.js
Normal file
@ -0,0 +1,48 @@
|
||||
export const shortcuts = [
|
||||
{ shortcut: "CTRL+S", title: "Save diagram", description: "" },
|
||||
{ shortcut: "CTRL+Shift+S", title: "Save diagram as", description: "" },
|
||||
{
|
||||
shortcut: "CTRL+O",
|
||||
title: "Open a diagram",
|
||||
description: "Load a saved diagram",
|
||||
},
|
||||
{ shortcut: "CTRL+C", title: "Copy selected element", description: "" },
|
||||
{ shortcut: "CTRL+V", title: "Paste selected element", description: "" },
|
||||
{ shortcut: "CTRL+X", title: "Cut selected element", description: "" },
|
||||
{ shortcut: "CTRL+D", title: "Duplicate selected element", description: "" },
|
||||
{ shortcut: "DEL", title: "Delete selected element", description: "" },
|
||||
{ shortcut: "CTRL+E", title: "Edit selected element", description: "" },
|
||||
{
|
||||
shortcut: "CTRL+I",
|
||||
title: "Import a diagram",
|
||||
description: "Import a diagram by uploadng a valid json or dbb file.",
|
||||
},
|
||||
{ shortcut: "CTRL+Z", title: "Undo" },
|
||||
{ shortcut: "CTRL+Y", title: "Redo" },
|
||||
{
|
||||
shortcut: "CTRL+SHIFT+M",
|
||||
title: "Enable/disable strict mode",
|
||||
description:
|
||||
"Disabling strict mode entails that the diagram will not undergo error or inconsistency checks.",
|
||||
},
|
||||
{
|
||||
shortcut: "CTRL+SHIFT+F",
|
||||
title: "Enable/disable field summaries",
|
||||
description:
|
||||
"Disabling field summaries will prevent the display of details for each field in the table when hovered over.",
|
||||
},
|
||||
{ shortcut: "CTRL+SHIFT+G", title: "Show/hide grid" },
|
||||
{
|
||||
shortcut: "CTRL+ALT+C",
|
||||
title: "Copy as image",
|
||||
description: "Save the canvas as an image to the clipboard.",
|
||||
},
|
||||
{
|
||||
shortcut: "CTRL+R",
|
||||
title: "Reset view",
|
||||
description: "Resetting view will set diagram pan to (0, 0).",
|
||||
},
|
||||
{ shortcut: "CTRL+UP / Wheel up", title: "Zoom in" },
|
||||
{ shortcut: "CTRL+DOWN / Wheel down", title: "Zoom out" },
|
||||
{ shortcut: "CTRL+H", title: "Open shortcuts" },
|
||||
];
|
||||
10
src/data/surveyQuestions.js
Normal file
10
src/data/surveyQuestions.js
Normal file
@ -0,0 +1,10 @@
|
||||
export const questions = {
|
||||
satisfaction: "How satisfied are you with drawDB?",
|
||||
ease: "How easy was it to get started with drawDB?",
|
||||
wouldRecommend: "How likely are you to recommend drawDB?",
|
||||
hadDifficulty: "Did you encounter any difficulties when navigating drawDB?",
|
||||
difficulty: "What were the difficulties you faced?",
|
||||
triedOtherApps: "Have you tried apps like drawDB?",
|
||||
comparison: "How did you find drawDB as compared to other apps?",
|
||||
occupation: "What is your occupation?",
|
||||
};
|
||||
@ -14,127 +14,6 @@ import discord from "../assets/discord.png";
|
||||
import FadeIn from "../animations/FadeIn";
|
||||
import SlideIn from "../animations/SlideIn";
|
||||
|
||||
const features = [
|
||||
{
|
||||
title: "Export",
|
||||
content: (
|
||||
<div>
|
||||
Export the DDL script to run on your database or export the diagram as a
|
||||
JSON or an image.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Import",
|
||||
content: (
|
||||
<div>
|
||||
Already have a diagram? Import a DDL script*, or a JSON file to generate
|
||||
or a diagram.
|
||||
</div>
|
||||
),
|
||||
footer: "*Only MySQL supported, more coming soon.",
|
||||
},
|
||||
{
|
||||
title: "Customizable workspace",
|
||||
content: (
|
||||
<div>
|
||||
Customize the UI to fit your preferences. Select the components you want
|
||||
in your view.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Keyboard shortcuts",
|
||||
content: (
|
||||
<div>
|
||||
Speed up development with keyboard shortuts. See all available shortcuts
|
||||
<Link to="/shortcuts" className="ms-1.5 text-blue-500 hover:underline">
|
||||
here
|
||||
</Link>
|
||||
.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Templates",
|
||||
content: (
|
||||
<div>
|
||||
Start off with pre-built templates. Get a quick start or get inspirition
|
||||
for your design.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Custom Templates",
|
||||
content: (
|
||||
<div>
|
||||
Have boilerplate structures? Save time by saving them as templates and
|
||||
load them when needed.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Robust editor",
|
||||
content: (
|
||||
<div>
|
||||
Undo, redo, copy, paste, duplacate and more. Add tables, subject areas,
|
||||
and notes.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Issue detection",
|
||||
content: (
|
||||
<div>
|
||||
Detect and tackle errors in the diagram to make sure the scripts are
|
||||
correct.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Relational databases",
|
||||
content: (
|
||||
<div>
|
||||
We support 5 relational databases - MySQL, PostgreSQL, SQLite, MariaDB,
|
||||
SQL Server.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Object-Relational databases",
|
||||
content: (
|
||||
<div>
|
||||
Add custom types for object-relational databases, or create custom JSON
|
||||
schemes and alias types.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Presentation mode",
|
||||
content: (
|
||||
<div>
|
||||
Present your diagrams on a big screen during team meetings and
|
||||
discussions.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Track todos",
|
||||
content: <div>Keep track of tasks and mark them done when finished.</div>,
|
||||
footer: "",
|
||||
},
|
||||
];
|
||||
|
||||
export default function LandingPage() {
|
||||
const [showSurvey, setShowSurvey] = useState(true);
|
||||
|
||||
@ -379,3 +258,124 @@ export default function LandingPage() {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const features = [
|
||||
{
|
||||
title: "Export",
|
||||
content: (
|
||||
<div>
|
||||
Export the DDL script to run on your database or export the diagram as a
|
||||
JSON or an image.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Import",
|
||||
content: (
|
||||
<div>
|
||||
Already have a diagram? Import a DDL script*, or a JSON file to generate
|
||||
or a diagram.
|
||||
</div>
|
||||
),
|
||||
footer: "*Only MySQL supported, more coming soon.",
|
||||
},
|
||||
{
|
||||
title: "Customizable workspace",
|
||||
content: (
|
||||
<div>
|
||||
Customize the UI to fit your preferences. Select the components you want
|
||||
in your view.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Keyboard shortcuts",
|
||||
content: (
|
||||
<div>
|
||||
Speed up development with keyboard shortuts. See all available shortcuts
|
||||
<Link to="/shortcuts" className="ms-1.5 text-blue-500 hover:underline">
|
||||
here
|
||||
</Link>
|
||||
.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Templates",
|
||||
content: (
|
||||
<div>
|
||||
Start off with pre-built templates. Get a quick start or get inspirition
|
||||
for your design.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Custom Templates",
|
||||
content: (
|
||||
<div>
|
||||
Have boilerplate structures? Save time by saving them as templates and
|
||||
load them when needed.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Robust editor",
|
||||
content: (
|
||||
<div>
|
||||
Undo, redo, copy, paste, duplacate and more. Add tables, subject areas,
|
||||
and notes.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Issue detection",
|
||||
content: (
|
||||
<div>
|
||||
Detect and tackle errors in the diagram to make sure the scripts are
|
||||
correct.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Relational databases",
|
||||
content: (
|
||||
<div>
|
||||
We support 5 relational databases - MySQL, PostgreSQL, SQLite, MariaDB,
|
||||
SQL Server.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Object-Relational databases",
|
||||
content: (
|
||||
<div>
|
||||
Add custom types for object-relational databases, or create custom JSON
|
||||
schemes and alias types.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Presentation mode",
|
||||
content: (
|
||||
<div>
|
||||
Present your diagrams on a big screen during team meetings and
|
||||
discussions.
|
||||
</div>
|
||||
),
|
||||
footer: "",
|
||||
},
|
||||
{
|
||||
title: "Track todos",
|
||||
content: <div>Keep track of tasks and mark them done when finished.</div>,
|
||||
footer: "",
|
||||
},
|
||||
];
|
||||
@ -4,55 +4,7 @@ import logo_dark from "../assets/logo_dark_160.png";
|
||||
import { AutoComplete, Button } from "@douyinfe/semi-ui";
|
||||
import { IconSearch, IconSun, IconMoon } from "@douyinfe/semi-icons";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
const shortcuts = [
|
||||
{ shortcut: "CTRL+S", title: "Save diagram", description: "" },
|
||||
{ shortcut: "CTRL+Shift+S", title: "Save diagram as", description: "" },
|
||||
{
|
||||
shortcut: "CTRL+O",
|
||||
title: "Open a diagram",
|
||||
description: "Load a saved diagram",
|
||||
},
|
||||
{ shortcut: "CTRL+C", title: "Copy selected element", description: "" },
|
||||
{ shortcut: "CTRL+V", title: "Paste selected element", description: "" },
|
||||
{ shortcut: "CTRL+X", title: "Cut selected element", description: "" },
|
||||
{ shortcut: "CTRL+D", title: "Duplicate selected element", description: "" },
|
||||
{ shortcut: "DEL", title: "Delete selected element", description: "" },
|
||||
{ shortcut: "CTRL+E", title: "Edit selected element", description: "" },
|
||||
{
|
||||
shortcut: "CTRL+I",
|
||||
title: "Import a diagram",
|
||||
description: "Import a diagram by uploadng a valid json or dbb file.",
|
||||
},
|
||||
{ shortcut: "CTRL+Z", title: "Undo" },
|
||||
{ shortcut: "CTRL+Y", title: "Redo" },
|
||||
{
|
||||
shortcut: "CTRL+SHIFT+M",
|
||||
title: "Enable/disable strict mode",
|
||||
description:
|
||||
"Disabling strict mode entails that the diagram will not undergo error or inconsistency checks.",
|
||||
},
|
||||
{
|
||||
shortcut: "CTRL+SHIFT+F",
|
||||
title: "Enable/disable field summaries",
|
||||
description:
|
||||
"Disabling field summaries will prevent the display of details for each field in the table when hovered over.",
|
||||
},
|
||||
{ shortcut: "CTRL+SHIFT+G", title: "Show/hide grid" },
|
||||
{
|
||||
shortcut: "CTRL+ALT+C",
|
||||
title: "Copy as image",
|
||||
description: "Save the canvas as an image to the clipboard.",
|
||||
},
|
||||
{
|
||||
shortcut: "CTRL+R",
|
||||
title: "Reset view",
|
||||
description: "Resetting view will set diagram pan to (0, 0).",
|
||||
},
|
||||
{ shortcut: "CTRL+UP / Wheel up", title: "Zoom in" },
|
||||
{ shortcut: "CTRL+DOWN / Wheel down", title: "Zoom out" },
|
||||
{ shortcut: "CTRL+H", title: "Open shortcuts" },
|
||||
];
|
||||
import { shortcuts } from "../data/shortcuts";
|
||||
|
||||
export default function Shortcuts() {
|
||||
const [theme, setTheme] = useState("");
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { useEffect, useState, useCallback, useMemo } from "react";
|
||||
import { useEffect, useState, useCallback } from "react";
|
||||
import logo_light from "../assets/logo_light_160.png";
|
||||
import logo_dark from "../assets/logo_dark_160.png";
|
||||
import {
|
||||
@ -21,23 +21,10 @@ import { CLEAR_EDITOR_COMMAND } from "lexical";
|
||||
import { Link } from "react-router-dom";
|
||||
import RichEditor from "../components/LexicalEditor/RichEditor";
|
||||
import axios from "axios";
|
||||
import { questions } from "../data/surveyQuestions";
|
||||
|
||||
function SurveyForm({ theme }) {
|
||||
const [editor] = useLexicalComposerContext();
|
||||
const questions = useMemo(
|
||||
() => ({
|
||||
satisfaction: "How satisfied are you with drawDB?",
|
||||
ease: "How easy was it to get started with drawDB?",
|
||||
wouldRecommend: "How likely are you to recommend drawDB?",
|
||||
hadDifficulty:
|
||||
"Did you encounter any difficulties when navigating drawDB?",
|
||||
difficulty: "What were the difficulties you faced?",
|
||||
triedOtherApps: "Have you tried apps like drawDB?",
|
||||
comparison: "How did you find drawDB as compared to other apps?",
|
||||
occupation: "What is your occupation?",
|
||||
}),
|
||||
[]
|
||||
);
|
||||
const [form, setForm] = useState({
|
||||
satisfaction: 5,
|
||||
ease: 5,
|
||||
@ -89,7 +76,7 @@ function SurveyForm({ theme }) {
|
||||
};
|
||||
sendMail();
|
||||
});
|
||||
}, [editor, form, questions]);
|
||||
}, [editor, form]);
|
||||
|
||||
return (
|
||||
<div className="py-5 px-8 mt-6 card-theme rounded-md">
|
||||
|
||||
@ -12,6 +12,7 @@ export default function Templates() {
|
||||
const defaultTemplates = useLiveQuery(() =>
|
||||
db.templates.where({ custom: 0 }).toArray()
|
||||
);
|
||||
|
||||
const customTemplates = useLiveQuery(() =>
|
||||
db.templates.where({ custom: 1 }).toArray()
|
||||
);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user