start disable modal ui + logic

This commit is contained in:
Ishaan Dey
2024-05-07 21:19:32 -07:00
parent beab0f7845
commit 9d288f580d
8 changed files with 283 additions and 222 deletions

View File

@ -1,7 +1,7 @@
"use client"
"use client";
import CustomButton from "@/components/ui/customButton"
import { Button } from "@/components/ui/button"
import CustomButton from "@/components/ui/customButton";
import { Button } from "@/components/ui/button";
import {
Code2,
FolderDot,
@ -9,44 +9,44 @@ import {
Plus,
Settings,
Users,
} from "lucide-react"
import { useState } from "react"
import { Sandbox } from "@/lib/types"
import DashboardProjects from "./projects"
import DashboardSharedWithMe from "./shared"
import NewProjectModal from "./newProject"
import Link from "next/link"
import { useSearchParams } from "next/navigation"
import AboutModal from "./about"
import { toast } from "sonner"
} from "lucide-react";
import { useState } from "react";
import { Sandbox } from "@/lib/types";
import DashboardProjects from "./projects";
import DashboardSharedWithMe from "./shared";
import NewProjectModal from "./newProject";
import Link from "next/link";
import { useSearchParams } from "next/navigation";
import AboutModal from "./about";
import { toast } from "sonner";
type TScreen = "projects" | "shared" | "settings" | "search"
type TScreen = "projects" | "shared" | "settings" | "search";
export default function Dashboard({
sandboxes,
shared,
}: {
sandboxes: Sandbox[]
sandboxes: Sandbox[];
shared: {
id: string
name: string
type: "react" | "node"
author: string
sharedOn: Date
}[]
id: string;
name: string;
type: "react" | "node";
author: string;
sharedOn: Date;
}[];
}) {
const [screen, setScreen] = useState<TScreen>("projects")
const [screen, setScreen] = useState<TScreen>("projects");
const [newProjectModalOpen, setNewProjectModalOpen] = useState(false)
const [aboutModalOpen, setAboutModalOpen] = useState(false)
const [newProjectModalOpen, setNewProjectModalOpen] = useState(false);
const [aboutModalOpen, setAboutModalOpen] = useState(false);
const activeScreen = (s: TScreen) => {
if (screen === s) return "justify-start"
else return "justify-start font-normal text-muted-foreground"
}
if (screen === s) return "justify-start";
else return "justify-start font-normal text-muted-foreground";
};
const searchParams = useSearchParams()
const q = searchParams.get("q")
const searchParams = useSearchParams();
const q = searchParams.get("q");
return (
<>
@ -61,10 +61,10 @@ export default function Dashboard({
<CustomButton
onClick={() => {
if (sandboxes.length >= 8) {
toast.error("You reached the maximum # of sandboxes.")
return
toast.error("You reached the maximum # of sandboxes.");
return;
}
setNewProjectModalOpen(true)
setNewProjectModalOpen(true);
}}
className="mb-4"
>
@ -97,7 +97,7 @@ export default function Dashboard({
</Button> */}
</div>
<div className="flex flex-col">
<Link href="https://github.com/ishaan1013/sandbox">
<a target="_blank" href="https://github.com/ishaan1013/sandbox">
<Button
variant="ghost"
className="justify-start font-normal text-muted-foreground"
@ -105,7 +105,7 @@ export default function Dashboard({
<Code2 className="w-4 h-4 mr-2" />
GitHub Repository
</Button>
</Link>
</a>
<Button
onClick={() => setAboutModalOpen(true)}
variant="ghost"
@ -123,5 +123,5 @@ export default function Dashboard({
) : screen === "settings" ? null : null}
</div>
</>
)
);
}