Make logo a link everywhere

This commit is contained in:
1ilit 2024-02-14 15:08:51 +02:00
parent 7cea7c9f5f
commit 2cc703b9b5
3 changed files with 54 additions and 47 deletions

View File

@ -15,6 +15,7 @@ import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext
import { $generateHtmlFromNodes } from "@lexical/html"; import { $generateHtmlFromNodes } from "@lexical/html";
import { CLEAR_EDITOR_COMMAND } from "lexical"; import { CLEAR_EDITOR_COMMAND } from "lexical";
import axios from "axios"; import axios from "axios";
import { Link } from "react-router-dom";
function Form({ theme }) { function Form({ theme }) {
const [editor] = useLexicalComposerContext(); const [editor] = useLexicalComposerContext();
@ -172,11 +173,13 @@ export default function BugReport() {
<> <>
<div className="sm:py-3 py-5 px-20 sm:px-6 flex justify-between items-center"> <div className="sm:py-3 py-5 px-20 sm:px-6 flex justify-between items-center">
<div className="flex items-center justify-start"> <div className="flex items-center justify-start">
<img <Link to="/">
src={theme === "dark" ? logo_dark : logo_light} <img
alt="logo" src={theme === "dark" ? logo_dark : logo_light}
className="me-2 sm:h-[28px] md:h-[46px]" alt="logo"
/> className="me-2 sm:h-[28px] md:h-[46px]"
/>
</Link>
<div className="ms-4 sm:text-sm xl:text-lg font-semibold"> <div className="ms-4 sm:text-sm xl:text-lg font-semibold">
Report a bug Report a bug
</div> </div>
@ -274,9 +277,10 @@ export default function BugReport() {
closeIcon={null} closeIcon={null}
description={ description={
<div> <div>
We value your feedback! If you&apos;ve encountered a bug or issue We value your feedback! If you&apos;ve encountered a bug or
while using our platform, please help us improve by reporting issue while using our platform, please help us improve by
it. Your input is invaluable in making our service better. reporting it. Your input is invaluable in making our service
better.
</div> </div>
} }
/> />

View File

@ -3,6 +3,7 @@ import logo_light from "../assets/logo_light_46.png";
import logo_dark from "../assets/logo_dark_46.png"; import logo_dark from "../assets/logo_dark_46.png";
import { AutoComplete, Button } from "@douyinfe/semi-ui"; import { AutoComplete, Button } from "@douyinfe/semi-ui";
import { IconSearch, IconSun, IconMoon } from "@douyinfe/semi-icons"; import { IconSearch, IconSun, IconMoon } from "@douyinfe/semi-icons";
import { Link } from "react-router-dom";
const shortcuts = [ const shortcuts = [
{ shortcut: "CTRL+S", title: "Save diagram", description: "" }, { shortcut: "CTRL+S", title: "Save diagram", description: "" },
@ -112,11 +113,13 @@ export default function Shortcuts() {
<> <>
<div className="sm:py-3 py-5 px-20 sm:px-6 flex justify-between items-center"> <div className="sm:py-3 py-5 px-20 sm:px-6 flex justify-between items-center">
<div className="flex items-center justify-start"> <div className="flex items-center justify-start">
<img <Link to="/">
src={theme === "dark" ? logo_dark : logo_light} <img
alt="logo" src={theme === "dark" ? logo_dark : logo_light}
className="me-2 sm:h-[28px] md:h-[46px]" alt="logo"
/> className="me-2 sm:h-[28px] md:h-[46px]"
/>
</Link>
<div className="ms-4 sm:text-sm xl:text-lg font-semibold"> <div className="ms-4 sm:text-sm xl:text-lg font-semibold">
Keyboard shortcuts Keyboard shortcuts
</div> </div>

View File

@ -20,6 +20,7 @@ import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext
import { $generateHtmlFromNodes } from "@lexical/html"; import { $generateHtmlFromNodes } from "@lexical/html";
import { CLEAR_EDITOR_COMMAND } from "lexical"; import { CLEAR_EDITOR_COMMAND } from "lexical";
import axios from "axios"; import axios from "axios";
import { Link } from "react-router-dom";
function SurveyForm({ theme }) { function SurveyForm({ theme }) {
const [editor] = useLexicalComposerContext(); const [editor] = useLexicalComposerContext();
@ -63,35 +64,32 @@ function SurveyForm({ theme }) {
setLoading(false); setLoading(false);
}; };
const onSubmit = useCallback( const onSubmit = useCallback(() => {
() => { setLoading(true);
setLoading(true); editor.update(() => {
editor.update(() => { const sendMail = async () => {
const sendMail = async () => { await axios
await axios .post(`${import.meta.env.VITE_API_BACKEND_URL}/send_email`, {
.post(`${import.meta.env.VITE_API_BACKEND_URL}/send_email`, { subject: `[SURVEY]: ${new Date().toDateString()}`,
subject: `[SURVEY]: ${new Date().toDateString()}`, message: `${Object.keys(form).map(
message: `${Object.keys(form).map( (k) => `<div>${questions[k]}</div><div>${form[k]}</div>`
(k) => `<div>${questions[k]}</div><div>${form[k]}</div>` )}<div>How can we make drawDB a better experience for you?</div>${$generateHtmlFromNodes(
)}<div>How can we make drawDB a better experience for you?</div>${$generateHtmlFromNodes( editor
editor )}`,
)}`, })
}) .then(() => {
.then(() => { Toast.success("Thanks for the feedback!");
Toast.success("Thanks for the feedback!"); editor.dispatchCommand(CLEAR_EDITOR_COMMAND, undefined);
editor.dispatchCommand(CLEAR_EDITOR_COMMAND, undefined); resetForm();
resetForm(); })
}) .catch(() => {
.catch(() => { Toast.error("Oops! Something went wrong.");
Toast.error("Oops! Something went wrong."); setLoading(false);
setLoading(false); });
}); };
}; sendMail();
sendMail(); });
}); }, [editor, form, questions]);
},
[editor, form, questions]
);
return ( return (
<div className="py-5 px-8 mt-6 card-theme rounded-md"> <div className="py-5 px-8 mt-6 card-theme rounded-md">
@ -276,11 +274,13 @@ export default function Survey() {
<> <>
<div className="sm:py-3 py-5 md:px-8 px-20 flex justify-between items-center"> <div className="sm:py-3 py-5 md:px-8 px-20 flex justify-between items-center">
<div className="flex items-center justify-start"> <div className="flex items-center justify-start">
<img <Link to="/">
src={theme === "dark" ? logo_dark : logo_light} <img
alt="logo" src={theme === "dark" ? logo_dark : logo_light}
className="me-2 sm:h-[28px] md:h-[46px]" alt="logo"
/> className="me-2 sm:h-[28px] md:h-[46px]"
/>
</Link>
<div className="ms-4 sm:text-sm xl:text-lg font-semibold"> <div className="ms-4 sm:text-sm xl:text-lg font-semibold">
Share your feedback Share your feedback
</div> </div>