cesnimda/jobtrackingapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(a11y): restore native keyboard file selection

Browse Source
This commit is contained in:
cesnimda
2026-10-10 21:52:01 +02:00
parent 24c98e160f
commit 57054349ef
5 changed files with 26 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
job-tracker-ui/src/components/ImportExportJobs.tsx
+7 -5
View File
@@ -1,4 +1,4 @@
import React, { useMemo, useState } from "react";
import React, { useMemo, useRef, useState } from "react";
import { Box, Button, Typography } from "@mui/material";
import { PageSection } from "../layout/PageLayout";
@@ -180,6 +180,8 @@ export default function ImportExportJobs() {
const { t } = useI18n();
const [importing, setImporting] = useState(false);
const [lastImportCount, setLastImportCount] = useState<number | null>(null);
const importInputRef = useRef<HTMLInputElement>(null);
const csvInputRef = useRef<HTMLInputElement>(null);
const exportAll = async (format: "json" | "csv") => {
try {
@@ -255,15 +257,15 @@ export default function ImportExportJobs() {
<Button variant="outlined" onClick={() => void exportAll("json")}>{t("exportJson")}</Button>
<Button variant="outlined" onClick={() => void exportAll("csv")}>{t("exportCsv")}</Button>
<Button variant="contained" component="label" disabled={importing}>
<Button variant="contained" disabled={importing} onClick={() => importInputRef.current?.click()}>
{importing ? t("profileUploading") : t("importJson")}
<input type="file" accept="application/json" hidden onChange={(e) => void onImportFile(e.target.files?.[0] ?? null)} />
</Button>
<input ref={importInputRef} type="file" accept="application/json" hidden onChange={(e) => void onImportFile(e.target.files?.[0] ?? null)} />
<Button variant="outlined" component="label">
<Button variant="outlined" onClick={() => csvInputRef.current?.click()}>
{t("convertCsvToImportJson")}
<input type="file" accept=".csv,text/csv" hidden onChange={(e) => void onConvertCsv(e.target.files?.[0] ?? null)} />
</Button>
<input ref={csvInputRef} type="file" accept=".csv,text/csv" hidden onChange={(e) => void onConvertCsv(e.target.files?.[0] ?? null)} />
{lastImportCount !== null && (
<Typography sx={{ ml: 1, color: "text.secondary" }}>