Qlockify/qlockify-frontend-deployment
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(timesheet): add tags management and responsive time tracking flows

Browse Source
This commit is contained in:
Amirhossein Khalili
2026-04-24 22:23:50 +03:30
parent c4d8379924
commit 987d2e2b59
13 changed files with 3710 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/ui/JalaliDatePicker.tsx
View File

@@ -6,14 +6,16 @@ import gregorian from "react-date-object/calendars/gregorian"
import gregorian_en from "react-date-object/locales/gregorian_en"
import "react-multi-date-picker/styles/backgrounds/bg-dark.css"
interface JalaliDatePickerProps {
value: string | null | undefined;
onChange: (date: string) => void;
label?: string;
disabled?: boolean;
}
export default function JalaliDatePicker({ value, onChange, label, disabled }: JalaliDatePickerProps) {
interface JalaliDatePickerProps {
value: string | null | undefined;
onChange: (date: string) => void;
label?: string;
disabled?: boolean;
inputClassName?: string;
placeholder?: string;
}
export default function JalaliDatePicker({ value, onChange, label, disabled, inputClassName = "", placeholder }: JalaliDatePickerProps) {
const isFa = document.documentElement.dir === 'rtl'
const [isDark, setIsDark] = useState(document.documentElement.classList.contains('dark'))
@@ -42,14 +44,17 @@ export default function JalaliDatePicker({ value, onChange, label, disabled }: J
{label}
</label>
)}
<DatePicker
value={value ? new Date(value) : null}
onChange={handleChange}
calendar={isFa ? persian : gregorian}
locale={isFa ? persian_fa : gregorian_en}
inputClass="w-full rounded-md border border-slate-300 bg-transparent px-3 py-2 text-sm dark:border-slate-700 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
containerClassName="w-full"
className={isDark ? "bg-dark" : ""}
<DatePicker
value={value ? new Date(value) : null}
onChange={handleChange}
calendar={isFa ? persian : gregorian}
locale={isFa ? persian_fa : gregorian_en}
format="YYYY/MM/DD"
placeholder={placeholder || "YYYY/MM/DD"}
onOpenPickNewDate={false}
inputClass={`w-full rounded-md border border-slate-300 bg-transparent px-3 py-2 text-sm dark:border-slate-700 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed ${inputClassName}`}
containerClassName="w-full"
className={isDark ? "bg-dark" : ""}
calendarPosition="bottom-right"
fixMainPosition
disabled={disabled}