chore: create issue modal improvement (#2960)

This commit is contained in:
Anmol Singh Bhatia 2023-12-01 15:12:25 +05:30 committed by sriram veeraghanta
parent f3f71f4f9e
commit 1ef0a86c9d
2 changed files with 58 additions and 28 deletions

View File

@ -104,7 +104,8 @@ export const IssueCycleSelect: React.FC<IssueCycleSelectProps> = observer((props
<div className={`mt-2 space-y-1 max-h-48 overflow-y-scroll`}> <div className={`mt-2 space-y-1 max-h-48 overflow-y-scroll`}>
{filteredOptions ? ( {filteredOptions ? (
filteredOptions.length > 0 ? ( filteredOptions.length > 0 ? (
filteredOptions.map((option) => ( <>
{filteredOptions.map((option) => (
<Combobox.Option <Combobox.Option
key={option.value} key={option.value}
value={option.value} value={option.value}
@ -121,7 +122,21 @@ export const IssueCycleSelect: React.FC<IssueCycleSelectProps> = observer((props
</> </>
)} )}
</Combobox.Option> </Combobox.Option>
)) ))}
<Combobox.Option
key="none"
value=""
className={({ active }) =>
`flex items-center justify-between gap-2 ${
active ? "bg-custom-background-80" : ""
} cursor-pointer select-none truncate rounded px-1 py-1.5 w-full text-custom-text-100`
}
>
<div className="flex items-center gap-1.5 truncate">
<span className="truncate flex-grow">None</span>
</div>
</Combobox.Option>
</>
) : ( ) : (
<span className="flex items-center gap-2 p-1"> <span className="flex items-center gap-2 p-1">
<p className="text-left text-custom-text-200 ">No matching results</p> <p className="text-left text-custom-text-200 ">No matching results</p>

View File

@ -98,7 +98,8 @@ export const IssueModuleSelect: React.FC<IssueModuleSelectProps> = observer((pro
<div className={`mt-2 space-y-1 max-h-48 overflow-y-scroll`}> <div className={`mt-2 space-y-1 max-h-48 overflow-y-scroll`}>
{filteredOptions ? ( {filteredOptions ? (
filteredOptions.length > 0 ? ( filteredOptions.length > 0 ? (
filteredOptions.map((option) => ( <>
{filteredOptions.map((option) => (
<Combobox.Option <Combobox.Option
key={option.value} key={option.value}
value={option.value} value={option.value}
@ -115,7 +116,21 @@ export const IssueModuleSelect: React.FC<IssueModuleSelectProps> = observer((pro
</> </>
)} )}
</Combobox.Option> </Combobox.Option>
)) ))}
<Combobox.Option
key="none"
value=""
className={({ active }) =>
`flex items-center justify-between gap-2 ${
active ? "bg-custom-background-80" : ""
} cursor-pointer select-none truncate rounded px-1 py-1.5 w-full text-custom-text-100`
}
>
<div className="flex items-center gap-1.5 truncate">
<span className="truncate flex-grow">None</span>
</div>
</Combobox.Option>
</>
) : ( ) : (
<span className="flex items-center gap-2 p-1"> <span className="flex items-center gap-2 p-1">
<p className="text-left text-custom-text-200 ">No matching results</p> <p className="text-left text-custom-text-200 ">No matching results</p>