Skip to content

Commit

Permalink
added functions to handle solve options
Browse files Browse the repository at this point in the history
  • Loading branch information
@bryanlundberg
bryanlundberg committed Sep 14, 2024
1 parent 725f67a commit 1e190ad
Show file tree
Hide file tree
Showing 3 changed files with 118 additions and 63 deletions.
105 changes: 105 additions & 0 deletions src/components/menu-solve-options/menu-solve-options.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,105 @@
import { Button } from "@/components/ui/button";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { Solve } from "@/interfaces/Solve";
import updateSolve from "@/lib/updateSolve";
import { useTimerStore } from "@/store/timerStore";
import { BookmarkIcon, CopyIcon, Cross1Icon } from "@radix-ui/react-icons";

export default function MenuSolveOptions({ solve }: { solve: Solve | null }) {
const { selectedCube, cubes, mergeUpdateSelectedCube } = useTimerStore();
if (!solve && !selectedCube) return null;

const handleDeleteSolve = async () => {
if (solve && selectedCube) {
const updatedCube = await updateSolve({
solveId: solve.id,
selectedCube: selectedCube,
type: "DELETE",
});
mergeUpdateSelectedCube(updatedCube, cubes);
}
};

const handlePenaltyPlus2 = async () => {
if (solve && selectedCube) {
const updatedCube = await updateSolve({
solveId: solve.id,
selectedCube: selectedCube,
type: "+2",
});
mergeUpdateSelectedCube(updatedCube, cubes);
}
};

const handleBookmarkSolve = async () => {
if (solve && selectedCube) {
const updatedCube = await updateSolve({
solveId: solve.id,
selectedCube: selectedCube,
type: "BOOKMARK",
});
mergeUpdateSelectedCube(updatedCube, cubes);
}
};

const handleClipboardSolve = () => {};

return (
<>
{/* options */}
<div className="flex items-center justify-center pt-5 gap-2">
<TooltipProvider delayDuration={100}>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"} onClick={handleDeleteSolve}>
<Cross1Icon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Delete</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button
variant={"ghost"}
className="font-light text-md"
onClick={handlePenaltyPlus2}
>
+2
</Button>
</TooltipTrigger>
<TooltipContent>
<p>+2 Penalty</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"} onClick={handleBookmarkSolve}>
<BookmarkIcon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Bookmark</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"}>
<CopyIcon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Copy</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
</>
);
}
74 changes: 12 additions & 62 deletions src/components/sheets/sheet-solve-details/SheetSolveDetails.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,18 @@
import MenuSolveOptions from "@/components/menu-solve-options/menu-solve-options";
import { ScrambleDisplay } from "@/components/scramble-display";
import { Button } from "@/components/ui/button";
import { Label } from "@/components/ui/label";
import {
SheetContent,
SheetDescription,
SheetHeader,
SheetTitle,
} from "@/components/ui/sheet";
import { Textarea } from "@/components/ui/textarea";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import formatTime from "@/lib/formatTime";
import { useDialogSolve } from "@/store/DialogSolve";
import { useTimerStore } from "@/store/timerStore";
import {
BookmarkIcon,
CalendarIcon,
ClockIcon,
CodeSandboxLogoIcon,
CopyIcon,
TrashIcon,
} from "@radix-ui/react-icons";
import { DateTime } from "luxon";
import { useLocale } from "next-intl";
Expand Down Expand Up @@ -56,9 +45,14 @@ export default function SheetSolveDetails() {
visualization="3D"
/>

<p className="font-black text-5xl text-center mx-auto pt-5 relative">
{formatTime(solve?.time || 0)}
</p>
<div className="tracking-wider font-black text-center mx-auto pt-5">
<span className="text-5xl">
{formatTime(solve?.time || 0).split(".")[0]}
</span>
<span className="text-4xl">
.{formatTime(solve?.time || 0).split(".")[1]}
</span>
</div>

<div className="flex justify-center gap-2 text-xs">
<p className="flex items-center justify-center gap-1">
Expand All @@ -76,56 +70,12 @@ export default function SheetSolveDetails() {
</div>

{/* comment */}
<div className="pt-5 flex justify-start flex-col">
{/* <div className="pt-5 flex justify-start flex-col">
<Label className="text-start">Comment</Label>
<Textarea className="mt-3 resize-none h-40" />
</div>
</div> */}

{/* options */}
<div className="flex items-center justify-center pt-5 gap-2">
<TooltipProvider delayDuration={100}>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"destructive"} className="me-10">
<TrashIcon className="w-4 h-4" />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Delete</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"} className="font-light text-md">
+2
</Button>
</TooltipTrigger>
<TooltipContent>
<p>+2 Penalty</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"}>
<BookmarkIcon className="w-4 h-4" />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Bookmark</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant={"ghost"}>
<CopyIcon className="w-4 h-4" />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Copy</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
<MenuSolveOptions solve={solve} />

<Image
src={"/brand_logo.svg"}
Expand Down
2 changes: 1 addition & 1 deletion src/components/solves/SolvesArea.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ export function SolvesArea({ displaySolves }: SolvesArea) {
<VirtualizedGrid
itemCount={sortedSolves.length}
rowHeight={60}
cellWidth={150}
cellWidth={120}
gridGap={10}
className="pb-52"
>
Expand Down

0 comments on commit 1e190ad

Please sign in to comment.