Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feat]: Update DynamicSelect component and localization Files #3334

Merged
merged 4 commits into from
Nov 14, 2024
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export function TimeSheetFilterPopover() {
<div className="">
<label className="flex justify-between text-gray-600 mb-1 text-sm">
<span className="text-[12px]">{t('manualTime.EMPLOYEE')}</span>
<span className={clsxm("text-primary/10")}>Clear</span>
<span className={clsxm("text-primary/10")}>{t('common.CLEAR')}</span>
Innocent-Akim marked this conversation as resolved.
Show resolved Hide resolved
</label>
<MultiSelect
removeItems={shouldRemoveItems}
Expand All @@ -61,7 +61,7 @@ export function TimeSheetFilterPopover() {
<div className="">
<label className="flex justify-between text-gray-600 mb-1 text-sm">
<span className="text-[12px]">{t('sidebar.PROJECTS')}</span>
<span className={clsxm("text-primary/10")}>Clear</span>
<span className={clsxm("text-primary/10")}>{t('common.CLEAR')}</span>
</label>
<MultiSelect
removeItems={shouldRemoveItems}
Expand All @@ -76,7 +76,7 @@ export function TimeSheetFilterPopover() {
<div className="">
<label className="flex justify-between text-gray-600 mb-1 text-sm">
<span className="text-[12px]">{t('hotkeys.TASK')}</span>
<span className={clsxm("text-primary/10")}>Clear</span>
<span className={clsxm("text-primary/10")}>{t('common.CLEAR')}</span>
</label>
<MultiSelect
removeItems={shouldRemoveItems}
Expand All @@ -91,7 +91,7 @@ export function TimeSheetFilterPopover() {
<div className="">
<label className="flex justify-between text-gray-600 mb-1 text-sm">
<span className="text-[12px]">{t('common.STATUS')}</span>
<span className={clsxm("text-primary/10")}>Clear</span>
<span className={clsxm("text-primary/10")}>{t('common.CLEAR')}</span>
</label>
<MultiSelect
removeItems={shouldRemoveItems}
Expand All @@ -108,11 +108,11 @@ export function TimeSheetFilterPopover() {
onClick={() => setShouldRemoveItems(true)}
variant={'outline'}
className='flex items-center text-sm justify-center h-10 rounded-lg dark:text-gray-300' >
<span className="text-sm">Clear Filter</span>
<span className="text-sm">{t('common.CLEAR_FILTER')}</span>
</Button>
<Button
className='flex items-center text-sm justify-center h-10 rounded-lg bg-primary dark:bg-primary-light dark:text-gray-300' >
<span className="text-sm">Apply Filter</span>
<span className="text-sm">{t('common.APPLY_FILTER')}</span>
</Button>
Innocent-Akim marked this conversation as resolved.
Show resolved Hide resolved
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -175,7 +175,7 @@ export function TimesheetFilterDate({
<Button
key={index}
variant="outline"
className="h-7 flex items-center justify-between border-none text-[12px] text-gray-700 dark:dark:bg-dark--theme-light"
className={clsxm("h-6 flex items-center justify-between border-none text-[12px] text-gray-700 dark:bg-dark--theme-light hover:bg-primary hover:text-white hover:dark:bg-primary-light")}
onClick={() => {
label === t('common.FILTER_CUSTOM_RANGE') && setIsVisible((prev) => !prev)
handlePresetClick(label)
Expand Down
69 changes: 69 additions & 0 deletions apps/web/lib/components/custom-select/select-items.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,16 @@ import { Popover, PopoverContent, PopoverTrigger } from '@components/ui/popover'
import { cn } from 'lib/utils';
import { useEffect, useState } from 'react';
import { MdOutlineKeyboardArrowDown } from 'react-icons/md';
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import React from 'react';

interface SelectItemsProps<T> {
items: T[];
Expand Down Expand Up @@ -94,3 +104,62 @@ export function SelectItems<T>({
</Popover>
);
}


type DynamicSelectProps<T> = {
items: T[]
label: string
placeholder: string
getItemLabel: (item: T) => string
getItemValue: (item: T) => string
onChange?: (value: string) => void
disabled?: boolean
error?: string
defaultValue?: string
}

export const DynamicSelect = React.memo(function DynamicSelect<T>({
items,
label,
placeholder,
getItemLabel,
getItemValue,
onChange,
disabled,
error,
defaultValue
}: DynamicSelectProps<T>) {
return (
<Select
onValueChange={onChange}
disabled={disabled}
defaultValue={defaultValue}>
<SelectTrigger
className={cn(
"w-full",
error && "border-red-500 focus:ring-red-500"
)}
>
<SelectValue placeholder={placeholder} />
</SelectTrigger>
<SelectContent className='z-[10000]'>
<SelectGroup>
<SelectLabel>{label}</SelectLabel>
{items.map((item, index) => (
<SelectItem key={getItemValue(item)} value={getItemValue(item)}>
{getItemLabel(item)}
</SelectItem>
))}
</SelectGroup>
</SelectContent>
{error && (
<p
className="mt-1 text-sm text-red-500"
role="alert"
aria-live="polite">
{error}
</p>
)}
</Select>
)
})
20 changes: 0 additions & 20 deletions apps/web/lib/features/manual-time/add-manual-time-modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -296,26 +296,6 @@ export function AddManualTimeModal(props: Readonly<IAddManualTimeModalProps>) {
{timeDifference}
</div>
</div>

{/* <div className="">
<label className="block text-gray-500 mb-1">
{t('manualTime.TEAM')}<span className="text-[#de5505e1] ml-1">*</span>
</label>
{
activeTeam ?
<SelectItems
defaultValue={activeTeam}
items={teams}
onValueChange={(team) => setTeam(team)}
itemId={(team) => (team ? team.id : '')}
itemToString={(team) => (team ? team.name : '')}
triggerClassName="border-gray-300 dark:border-slate-600"
/>
:
<></>
}
</div> */}

{params === 'AddManuelTime' ? (
<>
<ManageOrMemberComponent
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/ar.json
Original file line number Diff line number Diff line change
Expand Up @@ -244,7 +244,10 @@
"FILTER_LAST_7_DAYS": "آخر 7 أيام",
"FILTER_LAST_30_DAYS": "آخر 30 يومًا",
"FILTER_THIS_YEAR": "هذا العام {year}",
"FILTER_CUSTOM_RANGE": "نطاق مخصص"
"FILTER_CUSTOM_RANGE": "نطاق مخصص",
"CLEAR_FILTER": "مسح الفلتر",
"CLEAR": "مسح",
"APPLY_FILTER": "تطبيق الفلتر"
},
"sidebar": {
"DASHBOARD": "لوحة التحكم",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/bg.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Последните 7 дни",
"FILTER_LAST_30_DAYS": "Последните 30 дни",
"FILTER_THIS_YEAR": "Тази година {year}",
"FILTER_CUSTOM_RANGE": "Потребителски диапазон"
"FILTER_CUSTOM_RANGE": "Потребителски диапазон",
"CLEAR_FILTER": "Изчисти филтъра",
"CLEAR": "Изчисти",
"APPLY_FILTER": "Приложи филтър"
},
"hotkeys": {
"HELP": "Помощ",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Letzte 7 Tage",
"FILTER_LAST_30_DAYS": "Letzte 30 Tage",
"FILTER_THIS_YEAR": "Dieses Jahr {year}",
"FILTER_CUSTOM_RANGE": "Benutzerdefinierter Bereich"
"FILTER_CUSTOM_RANGE": "Benutzerdefinierter Bereich",
"CLEAR_FILTER": "Filter löschen",
"CLEAR": "Löschen",
"APPLY_FILTER": "Filter anwenden"
},
"hotkeys": {
"HELP": "Hilfe",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Last 7 Days",
"FILTER_LAST_30_DAYS": "Last 30 Days",
"FILTER_THIS_YEAR": "This year {year}",
"FILTER_CUSTOM_RANGE": "Custom Range"
"FILTER_CUSTOM_RANGE": "Custom Range",
"CLEAR_FILTER": "Clear Filter",
"CLEAR": "Clear",
"APPLY_FILTER": "Apply Filter"
},
"hotkeys": {
"HELP": "Help",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Últimos 7 días",
"FILTER_LAST_30_DAYS": "Últimos 30 días",
"FILTER_THIS_YEAR": "Este año {year}",
"FILTER_CUSTOM_RANGE": "Rango personalizado"
"FILTER_CUSTOM_RANGE": "Rango personalizado",
"CLEAR_FILTER": "Borrar filtro",
"CLEAR": "Borrar",
"APPLY_FILTER": "Aplicar filtro"
},
"hotkeys": {
"HELP": "Ayuda",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/fr.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Derniers 7 jours",
"FILTER_LAST_30_DAYS": "Derniers 30 jours",
"FILTER_THIS_YEAR": "Cette année {year}",
"FILTER_CUSTOM_RANGE": "Plage personnalisée"
"FILTER_CUSTOM_RANGE": "Plage personnalisée",
"CLEAR_FILTER": "Effacer le filtre",
"CLEAR": "Effacer",
"APPLY_FILTER": "Appliquer le filtre"
},
"hotkeys": {
"HELP": "Aide",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/he.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "ה-7 ימים האחרונים",
"FILTER_LAST_30_DAYS": "ה-30 ימים האחרונים",
"FILTER_THIS_YEAR": "שנה זו {year}",
"FILTER_CUSTOM_RANGE": "טווח מותאם אישית"
"FILTER_CUSTOM_RANGE": "טווח מותאם אישית",
"CLEAR_FILTER": "נקה סינון",
"CLEAR": "נקה",
"APPLY_FILTER": "החל סינון"
},
"hotkeys": {
"HELP": "עזרה",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/it.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Ultimi 7 giorni",
"FILTER_LAST_30_DAYS": "Ultimi 30 giorni",
"FILTER_THIS_YEAR": "Quest'anno {year}",
"FILTER_CUSTOM_RANGE": "Intervallo personalizzato"
"FILTER_CUSTOM_RANGE": "Intervallo personalizzato",
"CLEAR_FILTER": "Cancella filtro",
"CLEAR": "Cancella",
"APPLY_FILTER": "Applica filtro"
},
"hotkeys": {
"HELP": "Aiuto",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/nl.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Laatste 7 dagen",
"FILTER_LAST_30_DAYS": "Laatste 30 dagen",
"FILTER_THIS_YEAR": "Dit jaar {year}",
"FILTER_CUSTOM_RANGE": "Aangepast bereik"
"FILTER_CUSTOM_RANGE": "Aangepast bereik",
"CLEAR_FILTER": "Filter wissen",
"CLEAR": "Wissen",
"APPLY_FILTER": "Filter toepassen"
},
"hotkeys": {
"HELP": "Help",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/pl.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Ostatnie 7 dni",
"FILTER_LAST_30_DAYS": "Ostatnie 30 dni",
"FILTER_THIS_YEAR": "Ten rok {year}",
"FILTER_CUSTOM_RANGE": "Zakres niestandardowy"
"FILTER_CUSTOM_RANGE": "Zakres niestandardowy",
"CLEAR_FILTER": "Wyczyść filtr",
"CLEAR": "Wyczyść",
"APPLY_FILTER": "Zastosuj filtr"
},
"hotkeys": {
"HELP": "Pomoc",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/pt.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Últimos 7 dias",
"FILTER_LAST_30_DAYS": "Últimos 30 dias",
"FILTER_THIS_YEAR": "Este ano {year}",
"FILTER_CUSTOM_RANGE": "Faixa personalizada"
"FILTER_CUSTOM_RANGE": "Faixa personalizada",
"CLEAR_FILTER": "Limpar filtro",
"CLEAR": "Limpar",
"APPLY_FILTER": "Aplicar filtro"
},
"hotkeys": {
"HELP": "Ajuda",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/ru.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "Последние 7 дней",
"FILTER_LAST_30_DAYS": "Последние 30 дней",
"FILTER_THIS_YEAR": "Этот год {year}",
"FILTER_CUSTOM_RANGE": "Пользовательский диапазон"
"FILTER_CUSTOM_RANGE": "Пользовательский диапазон",
"CLEAR_FILTER": "Очистить фильтр",
"CLEAR": "Очистить",
"APPLY_FILTER": "Применить фильтр"
},
"hotkeys": {
"HELP": "Помощь",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/locales/zh.json
Original file line number Diff line number Diff line change
Expand Up @@ -262,7 +262,10 @@
"FILTER_LAST_7_DAYS": "过去7天",
"FILTER_LAST_30_DAYS": "过去30天",
"FILTER_THIS_YEAR": "今年 {year}",
"FILTER_CUSTOM_RANGE": "自定义范围"
"FILTER_CUSTOM_RANGE": "自定义范围",
"CLEAR_FILTER": "清除筛选",
"CLEAR": "清除",
Innocent-Akim marked this conversation as resolved.
Show resolved Hide resolved
"APPLY_FILTER": "应用筛选"
},
"hotkeys": {
"HELP": "帮助",
Expand Down
Loading