drawDB/src/pages/LandingPage.jsx
2023-10-26 20:26:13 +03:00

46 lines
1.3 KiB
JavaScript

import React, { useState, useEffect } from "react";
import { Link } from "react-router-dom";
import { IconCrossStroked } from "@douyinfe/semi-icons";
import Navbar from "../components/Navbar";
import { db } from "../data/db";
export default function LandingPage() {
const [showSurvey, setShowSurvey] = useState(true);
const clearDatabase = () => {
db.delete()
.then(() => {
console.log("Database cleared.");
})
.catch((error) => {
console.error("Failed to clear the database:", error);
});
};
useEffect(() => {
document.body.setAttribute("theme-mode", "light");
document.title =
"drawDB | Online database diagram editor and SQL generator";
});
return (
<div>
{showSurvey && (
<div className="text-white font-semibold py-1.5 px-4 text-sm text-center bg-gradient-to-r from-slate-700 from-10% via-slate-500 via-30% to-90% to-slate-700">
<Link to="/survey" className="hover:underline">
Help us improve! Share your feedback.
</Link>
<div className="float-right">
<button onClick={() => setShowSurvey(false)}>
<IconCrossStroked size="small" />
</button>
</div>
</div>
)}
<Navbar />
<button onClick={clearDatabase}>delete db</button>
</div>
);
}