diff --git a/src/data/shortcuts.js b/src/data/shortcuts.js new file mode 100644 index 0000000..38cc673 --- /dev/null +++ b/src/data/shortcuts.js @@ -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" }, +]; diff --git a/src/data/surveyQuestions.js b/src/data/surveyQuestions.js new file mode 100644 index 0000000..32f8ce0 --- /dev/null +++ b/src/data/surveyQuestions.js @@ -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?", +}; diff --git a/src/pages/LandingPage.jsx b/src/pages/LandingPage.jsx index 6b6aebe..2097b47 100644 --- a/src/pages/LandingPage.jsx +++ b/src/pages/LandingPage.jsx @@ -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: ( -
- Export the DDL script to run on your database or export the diagram as a - JSON or an image. -
- ), - footer: "", - }, - { - title: "Import", - content: ( -
- Already have a diagram? Import a DDL script*, or a JSON file to generate - or a diagram. -
- ), - footer: "*Only MySQL supported, more coming soon.", - }, - { - title: "Customizable workspace", - content: ( -
- Customize the UI to fit your preferences. Select the components you want - in your view. -
- ), - footer: "", - }, - { - title: "Keyboard shortcuts", - content: ( -
- Speed up development with keyboard shortuts. See all available shortcuts - - here - - . -
- ), - footer: "", - }, - { - title: "Templates", - content: ( -
- Start off with pre-built templates. Get a quick start or get inspirition - for your design. -
- ), - footer: "", - }, - { - title: "Custom Templates", - content: ( -
- Have boilerplate structures? Save time by saving them as templates and - load them when needed. -
- ), - footer: "", - }, - { - title: "Robust editor", - content: ( -
- Undo, redo, copy, paste, duplacate and more. Add tables, subject areas, - and notes. -
- ), - footer: "", - }, - { - title: "Issue detection", - content: ( -
- Detect and tackle errors in the diagram to make sure the scripts are - correct. -
- ), - footer: "", - }, - { - title: "Relational databases", - content: ( -
- We support 5 relational databases - MySQL, PostgreSQL, SQLite, MariaDB, - SQL Server. -
- ), - footer: "", - }, - { - title: "Object-Relational databases", - content: ( -
- Add custom types for object-relational databases, or create custom JSON - schemes and alias types. -
- ), - footer: "", - }, - { - title: "Presentation mode", - content: ( -
- Present your diagrams on a big screen during team meetings and - discussions. -
- ), - footer: "", - }, - { - title: "Track todos", - content:
Keep track of tasks and mark them done when finished.
, - footer: "", - }, -]; - export default function LandingPage() { const [showSurvey, setShowSurvey] = useState(true); @@ -379,3 +258,124 @@ export default function LandingPage() { ); } + +const features = [ + { + title: "Export", + content: ( +
+ Export the DDL script to run on your database or export the diagram as a + JSON or an image. +
+ ), + footer: "", + }, + { + title: "Import", + content: ( +
+ Already have a diagram? Import a DDL script*, or a JSON file to generate + or a diagram. +
+ ), + footer: "*Only MySQL supported, more coming soon.", + }, + { + title: "Customizable workspace", + content: ( +
+ Customize the UI to fit your preferences. Select the components you want + in your view. +
+ ), + footer: "", + }, + { + title: "Keyboard shortcuts", + content: ( +
+ Speed up development with keyboard shortuts. See all available shortcuts + + here + + . +
+ ), + footer: "", + }, + { + title: "Templates", + content: ( +
+ Start off with pre-built templates. Get a quick start or get inspirition + for your design. +
+ ), + footer: "", + }, + { + title: "Custom Templates", + content: ( +
+ Have boilerplate structures? Save time by saving them as templates and + load them when needed. +
+ ), + footer: "", + }, + { + title: "Robust editor", + content: ( +
+ Undo, redo, copy, paste, duplacate and more. Add tables, subject areas, + and notes. +
+ ), + footer: "", + }, + { + title: "Issue detection", + content: ( +
+ Detect and tackle errors in the diagram to make sure the scripts are + correct. +
+ ), + footer: "", + }, + { + title: "Relational databases", + content: ( +
+ We support 5 relational databases - MySQL, PostgreSQL, SQLite, MariaDB, + SQL Server. +
+ ), + footer: "", + }, + { + title: "Object-Relational databases", + content: ( +
+ Add custom types for object-relational databases, or create custom JSON + schemes and alias types. +
+ ), + footer: "", + }, + { + title: "Presentation mode", + content: ( +
+ Present your diagrams on a big screen during team meetings and + discussions. +
+ ), + footer: "", + }, + { + title: "Track todos", + content:
Keep track of tasks and mark them done when finished.
, + footer: "", + }, +]; \ No newline at end of file diff --git a/src/pages/Shortcuts.jsx b/src/pages/Shortcuts.jsx index 9cbc61f..7dd93a7 100644 --- a/src/pages/Shortcuts.jsx +++ b/src/pages/Shortcuts.jsx @@ -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(""); diff --git a/src/pages/Survey.jsx b/src/pages/Survey.jsx index 63a68cb..1291ba8 100644 --- a/src/pages/Survey.jsx +++ b/src/pages/Survey.jsx @@ -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 (
diff --git a/src/pages/Templates.jsx b/src/pages/Templates.jsx index 4d3ab71..58f1558 100644 --- a/src/pages/Templates.jsx +++ b/src/pages/Templates.jsx @@ -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() );