Skip to content

Commit

Permalink
[#3] added breadcrumbs to all dashboards
Browse files Browse the repository at this point in the history
  • Loading branch information
@Eriikah
Eriikah committed Jun 25, 2024
1 parent ee0a329 commit f3b563e
Show file tree
Hide file tree
Showing 2 changed files with 173 additions and 149 deletions.
280 changes: 138 additions & 142 deletions src/dashboards/HomePage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,97 +54,82 @@ export function HomePage() {

return (
<>
<div className="main">
<div>
<div>
<div>
<img
className="logo"
src={require("./../static/logo_llng_400px.png")}
alt="logo"
/>
</div>
<strong className="title1">{t("Configuration Manager")}</strong>
<img
className="logo"
src={require("./../static/logo_llng_400px.png")}
alt="logo"
/>
</div>
<div className="search-container">
<div className="search">
<Button
component="label"
role={undefined}
variant="contained"
tabIndex={-1}
startIcon={<DownloadIcon />}
onClick={async () =>
await exportData("full", config.data.metadata.cfgNum)
}
>
{t("downloadIt")}
</Button>
</div>
<div className="search">
<Button
component="label"
role={undefined}
variant="contained"
tabIndex={-1}
startIcon={<CloudUploadIcon />}
>
{t("restore")}
<VisuallyHiddenInput
type="file"
onChange={(e) => {
if (e.target instanceof HTMLInputElement) {
handleChangeFile(
e as ChangeEvent<HTMLInputElement>
).then((fileContent) => {
<strong className="title1">{t("Configuration Manager")}</strong>
</div>
<div className="search-container">
<div className="search">
<Button
component="label"
role={undefined}
variant="contained"
tabIndex={-1}
startIcon={<DownloadIcon />}
onClick={async () =>
await exportData("full", config.data.metadata.cfgNum)
}
>
{t("downloadIt")}
</Button>
</div>
<div className="search">
<Button
component="label"
role={undefined}
variant="contained"
tabIndex={-1}
startIcon={<CloudUploadIcon />}
>
{t("restore")}
<VisuallyHiddenInput
type="file"
onChange={(e) => {
if (e.target instanceof HTMLInputElement) {
handleChangeFile(e as ChangeEvent<HTMLInputElement>).then(
(fileContent) => {
console.debug("File content:", fileContent);
dispatch(
saveConfigAsync(
JSON.parse(fileContent) as llngConfig
)
);
setOpenSavePopup(true);
});
}
}}
/>
</Button>
</div>
<div className="search">
<Button
variant="contained"
onClick={() => dispatch(push(`#authParams/latest`))}
>
{t("authParams")}
</Button>
</div>
<div className="search">
<TextField
type="number"
size="small"
error={aimedConf <= 0}
helperText={`${
aimedConf === 0
? "Enter only positive and non nul numbers"
: ""
}`}
placeholder={t("search config num")}
onChange={(e) => SetAimedConf(Number(e.target.value))}
onKeyDown={(e) => {
if (e.key === "Enter") {
if (aimedConf <= config.data.metadata.cfgNum) {
dispatch(push(`#conf/${aimedConf}`));
} else
dispatch(
setError(
`Latest Config : ${config.data.metadata.cfgNum}`
)
);
}
);
}
}}
/>
<Button
variant="contained"
onClick={() => {
</Button>
</div>
<div className="search">
<Button
variant="contained"
onClick={() => dispatch(push(`#authParams/latest`))}
>
{t("authParams")}
</Button>
</div>
<div className="search">
<TextField
type="number"
size="small"
error={aimedConf <= 0}
helperText={`${
aimedConf === 0
? "Enter only positive and non nul numbers"
: ""
}`}
placeholder={t("search config num")}
onChange={(e) => SetAimedConf(Number(e.target.value))}
onKeyDown={(e) => {
if (e.key === "Enter") {
if (aimedConf <= config.data.metadata.cfgNum) {
dispatch(push(`#conf/${aimedConf}`));
} else
Expand All @@ -153,73 +138,84 @@ export function HomePage() {
`Latest Config : ${config.data.metadata.cfgNum}`
)
);
}}
>
{t("go")}
</Button>
</div>
</div>
<div className="desc">
<div>
<table className="infoTable">
<thead>
<tr>
<th>
<strong>{t("Latest conf info")}</strong>
</th>
</tr>
</thead>
<tbody>
<tr>
<th>
<span>{t("latest")}</span>
</th>
<td>
<Button
variant="contained"
onClick={() => {
dispatch(push(`#conf/latest`));
dispatch(getConfigAsync());
}}
>
{config.data.metadata.cfgNum}
</Button>
</td>
</tr>
<tr>
<th>
<span>{t("date")}</span>
</th>
<td>{createdDate.toLocaleString()}</td>
</tr>
<tr>
<th>
<span>{t("author")}</span>
</th>
<td>{config.data.metadata.cfgAuthor}</td>
</tr>
<tr>
<th>
<span>{t("authorIPAddress")}</span>
</th>
<td>{config.data.metadata.cfgAuthorIP}</td>
</tr>
</tbody>
</table>
</div>
}
}}
/>
<Button
variant="contained"
onClick={() => {
if (aimedConf <= config.data.metadata.cfgNum) {
dispatch(push(`#conf/${aimedConf}`));
} else
dispatch(
setError(`Latest Config : ${config.data.metadata.cfgNum}`)
);
}}
>
{t("go")}
</Button>
</div>
</div>
<div className="desc">
<div>
<strong className="title2">{t("Latest conf stats")}</strong>
<ConfStats config={config.data.config} />
</div>
<div
style={{
visibility: config.error.errorContent ? "visible" : "hidden",
}}
>
<strong>{t("latestError")}</strong> {config.error.errorContent}
<table className="infoTable">
<thead>
<tr>
<th>
<strong>{t("Latest conf info")}</strong>
</th>
</tr>
</thead>
<tbody>
<tr>
<th>
<span>{t("latest")}</span>
</th>
<td>
<Button
variant="contained"
onClick={() => {
dispatch(push(`#conf/latest`));
dispatch(getConfigAsync());
}}
>
{config.data.metadata.cfgNum}
</Button>
</td>
</tr>
<tr>
<th>
<span>{t("date")}</span>
</th>
<td>{createdDate.toLocaleString()}</td>
</tr>
<tr>
<th>
<span>{t("author")}</span>
</th>
<td>{config.data.metadata.cfgAuthor}</td>
</tr>
<tr>
<th>
<span>{t("authorIPAddress")}</span>
</th>
<td>{config.data.metadata.cfgAuthorIP}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>
<strong className="title2">{t("Latest conf stats")}</strong>
<ConfStats config={config.data.config} />
</div>
<div
style={{
visibility: config.error.errorContent ? "visible" : "hidden",
}}
>
<strong>{t("latestError")}</strong> {config.error.errorContent}
</div>
<Footer cfgVersion={config.data.config.cfgVersion} />
<SavePopup
config={config}
Expand Down
42 changes: 35 additions & 7 deletions src/pages/Configuration.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,12 @@ export function Configuration({
return (
<div className="main">
<Breadcrumbs>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(``))}>{t("conf")}</span>
</Link>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(`#conf/${metadata.cfgNum}`))}>
{t("conf")} {metadata.cfgNum}
{metadata.cfgNum}
</span>
</Link>
<Link underline="none" color="inherit">
Expand All @@ -51,6 +54,16 @@ export function Configuration({
case "conf":
return (
<div className="main">
<Breadcrumbs>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(``))}>{t("conf")}</span>
</Link>
<Link underline="hover" color="text.primary">
<span onClick={() => dispatch(push(`#conf/${metadata.cfgNum}`))}>
{metadata.cfgNum}
</span>
</Link>
</Breadcrumbs>
<Manager />
<div>
<SaveButton />
Expand All @@ -62,10 +75,13 @@ export function Configuration({
return (
<div className="main">
<Breadcrumbs>
<Link underline="none" color="inherit">
{location.info.name === "latest"
? `${t(location.info.name)} ${t("conf")}`
: `${t("conf")} ${t(location.info.name)}`}
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(``))}>{t("conf")}</span>
</Link>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(`#conf/${metadata.cfgNum}`))}>
{metadata.cfgNum}
</span>
</Link>
<Link underline="none" color="text.primary">
{t(location.type)}
Expand All @@ -88,9 +104,12 @@ export function Configuration({
return (
<div className="main">
<Breadcrumbs>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(``))}>{t("conf")}</span>
</Link>
<Link underline="hover" color="inherit">
<span onClick={() => dispatch(push(`#conf/${metadata.cfgNum}`))}>
{t("conf")} {metadata.cfgNum}
{metadata.cfgNum}
</span>
</Link>
<Link underline="none" color="inherit">
Expand All @@ -106,6 +125,15 @@ export function Configuration({
</div>
);
default:
return <HomePage />;
return (
<div className="main">
<Breadcrumbs>
<Link underline="hover" color="text.primary">
<span onClick={() => dispatch(push(``))}>{t("conf")}</span>
</Link>
</Breadcrumbs>
<HomePage />
</div>
);
}
}

0 comments on commit f3b563e

Please sign in to comment.