generated from jphacks/JP_sample
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into feat/kubosaka/form-refactor
- Loading branch information
Showing
11 changed files
with
12,016 additions
and
11,652 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
"use client"; | ||
|
||
import * as SliderPrimitive from "@radix-ui/react-slider"; | ||
import * as React from "react"; | ||
|
||
import { cn } from "@/lib/utils"; | ||
|
||
const Slider = React.forwardRef< | ||
React.ElementRef<typeof SliderPrimitive.Root>, | ||
React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root> | ||
>(({ className, ...props }, ref) => ( | ||
<SliderPrimitive.Root | ||
ref={ref} | ||
className={cn( | ||
"relative flex w-full touch-none select-none items-center", | ||
className, | ||
)} | ||
{...props} | ||
> | ||
<SliderPrimitive.Track className="relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20"> | ||
<SliderPrimitive.Range className="absolute h-full bg-primary" /> | ||
</SliderPrimitive.Track> | ||
<SliderPrimitive.Thumb className="block h-4 w-4 rounded-full border border-primary/50 bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50" /> | ||
</SliderPrimitive.Root> | ||
)); | ||
Slider.displayName = SliderPrimitive.Root.displayName; | ||
|
||
export { Slider }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,99 @@ | ||
"use client"; | ||
|
||
import { Calendar, Camera, Trophy, X } from "lucide-react"; | ||
import type * as React from "react"; | ||
|
||
import { Button } from "@/components/ui/button"; | ||
import { | ||
Dialog, | ||
DialogContent, | ||
DialogHeader, | ||
DialogTitle, | ||
} from "@/components/ui/dialog"; | ||
import { useState } from "react"; | ||
import { useHasShownOnce } from "../../lib/atom"; | ||
|
||
interface NotificationDialogProps { | ||
type: "login" | "photo" | "ranking"; | ||
customTitle?: string; | ||
customMessage?: string; | ||
customSubMessage?: string; | ||
} | ||
|
||
export function PointDialog({ | ||
type = "login", | ||
customTitle, | ||
customMessage, | ||
customSubMessage, | ||
}: NotificationDialogProps) { | ||
const [hasShownOnce, _] = useHasShownOnce(); | ||
const [isOpen, setIsOpen] = useState<boolean>(hasShownOnce); | ||
|
||
const content = { | ||
login: { | ||
title: customTitle || "ログイン継続中!", | ||
icon: Calendar, | ||
iconColor: "text-blue-500", | ||
message: customMessage || "1日目", | ||
subMessage: customSubMessage || "ポイントを獲得しました!", | ||
}, | ||
photo: { | ||
title: customTitle || "撮影に成功しました!", | ||
icon: Camera, | ||
iconColor: "text-green-500", | ||
message: customMessage || "素晴らしい写真です!", | ||
subMessage: customSubMessage || "ポイントを獲得しました!", | ||
}, | ||
ranking: { | ||
title: customTitle || "ランキング結果発表!", | ||
icon: Trophy, | ||
iconColor: "text-yellow-500", | ||
message: customMessage || "第10位", | ||
subMessage: customSubMessage || "ポイントを獲得しました!", | ||
}, | ||
}; | ||
|
||
const { | ||
title: dialogTitle, | ||
icon: Icon, | ||
iconColor, | ||
message, | ||
subMessage, | ||
} = content[type]; | ||
|
||
return ( | ||
<Dialog open={isOpen} onOpenChange={setIsOpen}> | ||
<DialogContent className="sm:max-w-md max-w-xs mx-auto px-4 rounded-lg"> | ||
<DialogHeader> | ||
<Button | ||
variant="ghost" | ||
className="absolute right-4 top-4 h-4 w-4 p-0" | ||
onClick={() => setIsOpen(false)} | ||
> | ||
<X className="h-4 w-4" /> | ||
</Button> | ||
</DialogHeader> | ||
<DialogTitle> | ||
<div className="space-y-2 text-center mt-4"> | ||
<h2 className="text-xl font-semibold">{dialogTitle}</h2> | ||
</div> | ||
</DialogTitle> | ||
<div className="flex flex-col items-center gap-4"> | ||
<div className={`rounded-full p-3 ${iconColor} bg-opacity-10`}> | ||
<Icon className={`h-10 w-10 ${iconColor}`} /> | ||
</div> | ||
<div className="space-y-2 text-center"> | ||
<p className="text-sm text-muted-foreground">{message}</p> | ||
<p className="text-sm text-muted-foreground">{subMessage}</p> | ||
</div> | ||
<Button | ||
className="mt-4 w-full max-w-[200px] rounded-full" | ||
onClick={() => setIsOpen(false)} | ||
> | ||
閉じる | ||
</Button> | ||
</div> | ||
</DialogContent> | ||
</Dialog> | ||
); | ||
} |
Oops, something went wrong.