From 6d1c2df40b0dbaa92976bc324e53cebe9ce8c54b Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Sat, 25 Mar 2023 12:57:51 +0200 Subject: [PATCH] release notes page --- .env | 4 +- public/locales/en/translations.json | 4 ++ public/locales/ro/translations.json | 4 ++ src/api/useApi.js | 10 ++++ .../about/releaseNotes/ReleaseNote.js | 27 +++++++++ .../about/releaseNotes/ReleaseNoteSummary.js | 37 ++++++++++++ .../releaseNotes/ReleaseNotesContainer.js | 19 ++++++- .../about/releaseNotes/ReleaseNotesList.js | 56 +++++++++++++++++++ 8 files changed, 157 insertions(+), 4 deletions(-) create mode 100644 src/features/about/releaseNotes/ReleaseNote.js create mode 100644 src/features/about/releaseNotes/ReleaseNoteSummary.js create mode 100644 src/features/about/releaseNotes/ReleaseNotesList.js diff --git a/.env b/.env index c6fe26f..138dabb 100644 --- a/.env +++ b/.env @@ -1,8 +1,8 @@ #REACT_APP_TUITIO_URL=http://localhost:5063 REACT_APP_TUITIO_URL=https://lab.code-rove.com/tuitio -#REACT_APP_NETWORK_RESURRECTOR_API_URL=http://localhost:5064 -REACT_APP_NETWORK_RESURRECTOR_API_URL=https://lab.code-rove.com/network-resurrector-api +REACT_APP_NETWORK_RESURRECTOR_API_URL=http://localhost:5064 +#REACT_APP_NETWORK_RESURRECTOR_API_URL=https://lab.code-rove.com/network-resurrector-api #600000 milliseconds = 10 minutes REACT_APP_MACHINE_PING_INTERVAL=600000 diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json index 7bcf54e..f268ff2 100644 --- a/public/locales/en/translations.json +++ b/public/locales/en/translations.json @@ -65,6 +65,10 @@ "Navigation": { "System": "System", "ReleaseNotes": "Release notes" + }, + "ReleaseNotes": { + "Version": "Version", + "Date": "Date" } } } diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json index fa200f6..64adf04 100644 --- a/public/locales/ro/translations.json +++ b/public/locales/ro/translations.json @@ -56,6 +56,10 @@ "Navigation": { "System": "Sistem", "ReleaseNotes": "Note de lansare" + }, + "ReleaseNotes": { + "Version": "Versiune", + "Date": "Dată" } } } diff --git a/src/api/useApi.js b/src/api/useApi.js index 338cc54..e47ed2c 100644 --- a/src/api/useApi.js +++ b/src/api/useApi.js @@ -2,6 +2,7 @@ import { useToast } from "../hooks"; import { get, post } from "../utils/axios"; const networkRoute = `${process.env.REACT_APP_NETWORK_RESURRECTOR_API_URL}/network`; +const systemRoute = `${process.env.REACT_APP_NETWORK_RESURRECTOR_API_URL}/system`; const powerActionsRoute = `${process.env.REACT_APP_NETWORK_RESURRECTOR_API_URL}/resurrector`; const useApi = () => { @@ -42,6 +43,14 @@ const useApi = () => { } }; + const readReleaseNotes = (options = defaultOptions) => { + const releaseNotesPromise = call( + () => get(`${systemRoute}/release-notes`), + options + ); + return releaseNotesPromise; + }; + const readMachines = (options = defaultOptions) => { const machinesPromise = call( () => get(`${networkRoute}/machines`), @@ -93,6 +102,7 @@ const useApi = () => { }; return { + readReleaseNotes, readMachines, wakeMachine, pingMachine, diff --git a/src/features/about/releaseNotes/ReleaseNote.js b/src/features/about/releaseNotes/ReleaseNote.js new file mode 100644 index 0000000..83bc923 --- /dev/null +++ b/src/features/about/releaseNotes/ReleaseNote.js @@ -0,0 +1,27 @@ +import React from "react"; +import PropTypes from "prop-types"; +import Typography from "@material-ui/core/Typography"; + +const ReleaseNote = ({ releaseNote }) => { + return ( +
+ {releaseNote.notes.map(note => { + return ( + + {note} + + ); + })} +
+ ); +}; + +ReleaseNote.propTypes = { + releaseNote: PropTypes.object.isRequired +}; + +export default ReleaseNote; diff --git a/src/features/about/releaseNotes/ReleaseNoteSummary.js b/src/features/about/releaseNotes/ReleaseNoteSummary.js new file mode 100644 index 0000000..0bff6b4 --- /dev/null +++ b/src/features/about/releaseNotes/ReleaseNoteSummary.js @@ -0,0 +1,37 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Grid, Typography } from "@material-ui/core"; +import { useTranslation } from "react-i18next"; + +const ReleaseNoteSummary = ({ releaseNote, collapsed }) => { + const { t } = useTranslation(); + + return ( + + + + {`${t("About.ReleaseNotes.Version")}: ${releaseNote.version}`} + + + + + {`${t("About.ReleaseNotes.Date")}: ${t("DATE_FORMAT", { + date: { value: releaseNote.date, format: "DD-MM-YYYY HH:mm" } + })}`} + + + {collapsed && ( + + {releaseNote.notes[0]} + + )} + + ); +}; + +ReleaseNoteSummary.propTypes = { + releaseNote: PropTypes.object.isRequired, + collapsed: PropTypes.bool.isRequired +}; + +export default ReleaseNoteSummary; diff --git a/src/features/about/releaseNotes/ReleaseNotesContainer.js b/src/features/about/releaseNotes/ReleaseNotesContainer.js index 19eca2b..df69acf 100644 --- a/src/features/about/releaseNotes/ReleaseNotesContainer.js +++ b/src/features/about/releaseNotes/ReleaseNotesContainer.js @@ -1,7 +1,22 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; +import useApi from "../../../api"; +import ReleaseNotesList from "./ReleaseNotesList"; const ReleaseNotesContainer = () => { - return <>ReleaseNotesContainer; + const [state, setState] = useState({ data: [], loaded: false }); + + const api = useApi(); + + useEffect(() => { + if (state.loaded) return; + api.readReleaseNotes({ + onCompleted: data => { + setState({ data, loaded: true }); + } + }); + }, [api, state.loaded]); + + return <>{state.loaded && }; }; export default ReleaseNotesContainer; diff --git a/src/features/about/releaseNotes/ReleaseNotesList.js b/src/features/about/releaseNotes/ReleaseNotesList.js new file mode 100644 index 0000000..d1adf5e --- /dev/null +++ b/src/features/about/releaseNotes/ReleaseNotesList.js @@ -0,0 +1,56 @@ +import React, { useState } from "react"; +import PropTypes from "prop-types"; +import { + Accordion, + AccordionSummary, + AccordionDetails +} from "@material-ui/core"; +import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; +import ReleaseNoteSummary from "./ReleaseNoteSummary"; +import ReleaseNote from "./ReleaseNote"; + +const ReleaseNotesList = ({ releaseNotes }) => { + const [flags, setFlags] = useState({}); + + const handleToggle = key => (_, expanded) => { + setFlags(prev => ({ + ...prev, + [key]: expanded + })); + }; + + const isCollapsed = key => { + const expanded = flags[key]; + const collapsed = !expanded || expanded === false; + return collapsed; + }; + + return ( + <> + {releaseNotes.map(note => { + return ( + + } + id={`panel-${note.version}-header`} + > + + + + + + + ); + })} + + ); +}; + +ReleaseNotesList.propTypes = { + releaseNotes: PropTypes.array.isRequired +}; + +export default ReleaseNotesList;