86 lines
2.5 KiB
86 lines
2.5 KiB
import { useState } from 'react';
|
|
import {
|
|
BuildingOffice2Icon,
|
|
CalendarDaysIcon,
|
|
QuestionMarkCircleIcon,
|
|
} from '@heroicons/react/24/outline';
|
|
import { TextInput } from '@tih/ui';
|
|
|
|
import { useProtectedCallback } from '~/utils/questions/useProtectedCallback';
|
|
|
|
import ContributeQuestionDialog from './ContributeQuestionDialog';
|
|
import type { ContributeQuestionFormProps } from './forms/ContributeQuestionForm';
|
|
|
|
export type ContributeQuestionCardProps = Pick<
|
|
ContributeQuestionFormProps,
|
|
'onSubmit'
|
|
>;
|
|
|
|
export default function ContributeQuestionCard({
|
|
onSubmit,
|
|
}: ContributeQuestionCardProps) {
|
|
const [showDraftDialog, setShowDraftDialog] = useState(false);
|
|
|
|
const handleDraftDialogCancel = () => {
|
|
setShowDraftDialog(false);
|
|
};
|
|
|
|
const handleOpenContribute = useProtectedCallback(() => {
|
|
setShowDraftDialog(true);
|
|
});
|
|
|
|
return (
|
|
<div className="w-full">
|
|
<button
|
|
className="flex flex-col items-stretch justify-center gap-2 rounded-md border border-slate-300 bg-white p-4 text-left hover:bg-slate-100"
|
|
type="button"
|
|
onClick={handleOpenContribute}>
|
|
<TextInput
|
|
disabled={true}
|
|
isLabelHidden={true}
|
|
label="Question"
|
|
placeholder="Contribute a question"
|
|
onChange={handleOpenContribute}
|
|
/>
|
|
<div className="flex flex-wrap items-end justify-center gap-x-2">
|
|
<div className="min-w-[150px] flex-1">
|
|
<TextInput
|
|
disabled={true}
|
|
label="Company"
|
|
startAddOn={BuildingOffice2Icon}
|
|
startAddOnType="icon"
|
|
onChange={handleOpenContribute}
|
|
/>
|
|
</div>
|
|
<div className="min-w-[150px] flex-1">
|
|
<TextInput
|
|
disabled={true}
|
|
label="Question type"
|
|
startAddOn={QuestionMarkCircleIcon}
|
|
startAddOnType="icon"
|
|
onChange={handleOpenContribute}
|
|
/>
|
|
</div>
|
|
<div className="min-w-[150px] flex-1">
|
|
<TextInput
|
|
disabled={true}
|
|
label="Date"
|
|
startAddOn={CalendarDaysIcon}
|
|
startAddOnType="icon"
|
|
onChange={handleOpenContribute}
|
|
/>
|
|
</div>
|
|
<h1 className="bg-primary-600 hover:bg-primary-700 rounded-full px-3 py-2 text-white">
|
|
Contribute
|
|
</h1>
|
|
</div>
|
|
<ContributeQuestionDialog
|
|
show={showDraftDialog}
|
|
onCancel={handleDraftDialogCancel}
|
|
onSubmit={onSubmit}
|
|
/>
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|