mirror of
https://github.com/supabase/supabase.git
synced 2026-10-15 06:09:08 +03:00
* Add another page for claiming a project. * Fix a misspell. * Minor fixes. * Comment some test code. * Update the design on the confirm step. * Reorganize the authorize page. Bunch of design fixes for the claim page. * Fix * Delete added files my mistake. * Separate claim-project and authorize pages. Minor design fixes. * Add more logs to the generate claim button. * snapshot. * Add more copy to the three steps. * Make the claim URL button better. * Add missing comma. * Fix unneeded changes. * Make the header full width. * Fix all comments by Joshen. * Clean up extra code. * Forgotten some things to clean. --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
79 lines
2.6 KiB
TypeScript
79 lines
2.6 KiB
TypeScript
import { Lightbulb, TriangleAlert } from 'lucide-react'
|
|
import Link from 'next/link'
|
|
import { useState } from 'react'
|
|
|
|
import { Button, PopoverContent_Shadcn_, PopoverTrigger_Shadcn_, Popover_Shadcn_ } from 'ui'
|
|
import { FeedbackWidget } from './FeedbackWidget'
|
|
|
|
const FeedbackDropdown = ({ className }: { className?: string }) => {
|
|
const [isOpen, setIsOpen] = useState(false)
|
|
const [feedback, setFeedback] = useState('')
|
|
const [screenshot, setScreenshot] = useState<string>()
|
|
const [stage, setStage] = useState<'select' | 'widget'>('select')
|
|
|
|
return (
|
|
<Popover_Shadcn_
|
|
modal={false}
|
|
open={isOpen}
|
|
onOpenChange={(e) => {
|
|
setIsOpen(e)
|
|
if (!e) setScreenshot(undefined)
|
|
if (!e) setStage('select')
|
|
}}
|
|
>
|
|
<PopoverTrigger_Shadcn_ asChild>
|
|
<Button
|
|
asChild
|
|
onClick={() => {
|
|
setIsOpen((isOpen) => !isOpen)
|
|
setStage('select')
|
|
}}
|
|
type="outline"
|
|
className="rounded-full h-[32px] border-border"
|
|
>
|
|
<span className={className}>Feedback</span>
|
|
</Button>
|
|
</PopoverTrigger_Shadcn_>
|
|
<PopoverContent_Shadcn_
|
|
side="bottom"
|
|
align="end"
|
|
className="px-0 flex flex-col pt-1 pb-3 w-96"
|
|
id="feedback-widget"
|
|
>
|
|
{stage === 'select' && (
|
|
<div className="flex flex-col gap-4 p-4">
|
|
<div className="font-medium text-sm">What would you like to share?</div>
|
|
<div className="grid grid-cols-2 gap-3">
|
|
<Button type="default" className="h-24" onClick={() => setIsOpen(false)} asChild>
|
|
<Link href="/support/new">
|
|
<span className="grid gap-1 text-center">
|
|
<TriangleAlert size="28" className="mx-auto text-destructive-600" />
|
|
<span className="text-sm">Issue</span>
|
|
</span>
|
|
</Link>
|
|
</Button>
|
|
<Button type="default" className="h-24" onClick={() => setStage('widget')}>
|
|
<span className="grid gap-1 text-center">
|
|
<Lightbulb size="28" className="mx-auto text-warning" />
|
|
<span className="text-sm">Idea</span>
|
|
</span>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)}
|
|
{stage === 'widget' && (
|
|
<FeedbackWidget
|
|
onClose={() => setIsOpen(false)}
|
|
feedback={feedback}
|
|
setFeedback={setFeedback}
|
|
screenshot={screenshot}
|
|
setScreenshot={setScreenshot}
|
|
/>
|
|
)}
|
|
</PopoverContent_Shadcn_>
|
|
</Popover_Shadcn_>
|
|
)
|
|
}
|
|
|
|
export default FeedbackDropdown
|