From ec7fb0ecc328a698540370fcdca1b4e08363a610 Mon Sep 17 00:00:00 2001 From: Roman Date: Wed, 27 Mar 2024 11:37:57 +0100 Subject: [PATCH] replaced dayjs with date-fns --- README.md | 14 +++++------ react/admin-panel/src/views/log-view.js | 32 +++++++++++++------------ react/package.json | 1 - react/shared/constants.js | 3 --- react/shared/locale.js | 3 ++- react/shared/util.js | 13 ++++++++-- 6 files changed, 36 insertions(+), 30 deletions(-) diff --git a/README.md b/README.md index 3d60f23..50f3d57 100644 --- a/README.md +++ b/README.md @@ -165,14 +165,14 @@ To access and view any frontend pages, the internal router is used. Available ro A static route targets a file, usually located in [/static](/static) and does nothing more, than returning its content. A dynamic route is usually the way to go: It takes two parameters, firstly the target document and secondly, an optional view. For example, take the following routing table: -| Route | Action | Target | Extra | -| ----- | ------ | ------ | ----- | -| `/funnyCatImage` | `Serve Static` | `/static/cat.jpg` | | -| `/someRoute(/(.*))?` | `Redirect Dynamic` | `\Documents\MyDocument\` | `$2` | +| Route | Action | Target | Extra | +|---------------------------| ------ | ------ |---------| +| `/funnyCatImage` | `Serve Static` | `/static/cat.jpg` | | +| `/someRoute/{param:str?}` | `Redirect Dynamic` | `\Documents\MyDocument\` | `param` | The first route would return the cat image, if the case-insensitive path `/funnyCatImage` is requested. -The second route is more interesting, as it firstly contains regex, which means, any route starting with `/someRoute/` or just `/someRoute` is accepted. -Secondly, it passes the second group (`$2`), which is all the text after the last slash (or `null`) to the dynamically loaded document `MyDocument`. +The second route is more interesting, as it includes an optional parameter of type string, which means, any route starting with `/someRoute/` or just `/someRoute` is accepted. +Secondly, it passes the second argument (`param`), which is all the text after the last slash (or `null`) to the dynamically loaded document `MyDocument`. ### Creating and Modifying documents @@ -299,7 +299,6 @@ php cli.php db migrate Patch/SomePatch ### Route commands ```bash -# Route commands php cli.php routes list php cli.php routes remove 1 php cli.php routes enable 1 @@ -310,7 +309,6 @@ php cli.php routes modify 1 '/regex(/.*)?' dynamic '\\Documents\\Test' ### Frontend commands ```bash -# Frontend commands php cli.php frontend build php cli.php frontend ls php cli.php frontend add diff --git a/react/admin-panel/src/views/log-view.js b/react/admin-panel/src/views/log-view.js index 5796cfd..bb27e5d 100644 --- a/react/admin-panel/src/views/log-view.js +++ b/react/admin-panel/src/views/log-view.js @@ -1,14 +1,14 @@ import {useCallback, useContext, useEffect, useState} from "react"; import {LocaleContext} from "shared/locale"; -import {Link, useNavigate} from "react-router-dom"; +import {Link} from "react-router-dom"; import usePagination from "shared/hooks/pagination"; import {DataColumn, DataTable, DateTimeColumn, NumericColumn, StringColumn} from "shared/elements/data-table"; -import dayjs, { Dayjs } from 'dayjs'; -import {Chip, TextField} from "@mui/material"; -import {DateTimePicker} from "@mui/x-date-pickers"; -import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; +import {TextField} from "@mui/material"; +import {DesktopDateTimePicker} from "@mui/x-date-pickers"; +import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; -import {API_DATETIME_FORMAT_DAYJS} from "shared/constants"; +import {API_DATETIME_FORMAT} from "shared/constants"; +import {format, toDate} from "date-fns"; export default function LogView(props) { @@ -18,7 +18,6 @@ export default function LogView(props) { const api = props.api; const showDialog = props.showDialog; const {translate: L, requestModules, currentLocale} = useContext(LocaleContext); - const navigate = useNavigate(); const pagination = usePagination(); const [logEntries, setLogEntries] = useState([]); @@ -37,7 +36,11 @@ export default function LogView(props) { }, [currentLocale]); const onFetchLogs = useCallback((page, count, orderBy, sortOrder) => { - api.fetchLogEntries(page, count, orderBy, sortOrder, LOG_LEVELS[logLevel], timestamp?.format(API_DATETIME_FORMAT_DAYJS), query).then((res) => { + api.fetchLogEntries(page, count, orderBy, sortOrder, + LOG_LEVELS[logLevel], + timestamp ? format(timestamp, API_DATETIME_FORMAT) : null, + query + ).then((res) => { if (res.success) { setLogEntries(res.logs); pagination.update(res.pagination); @@ -99,13 +102,12 @@ export default function LogView(props) {
- - {console.log(newValue); - setTimestamp(newValue) - }} + + setTimestamp(newValue)} slotProps={{ textField: { size: 'small' } }} /> diff --git a/react/package.json b/react/package.json index 4a63d00..4d130f1 100644 --- a/react/package.json +++ b/react/package.json @@ -43,7 +43,6 @@ "chart.js": "^4.0.1", "clsx": "^1.2.1", "date-fns": "^2.29.3", - "dayjs": "^1.11.10", "material-ui-color-picker": "^3.5.1", "mini-css-extract-plugin": "^2.7.1", "react": "^18.2.0", diff --git a/react/shared/constants.js b/react/shared/constants.js index 54115b1..2803229 100644 --- a/react/shared/constants.js +++ b/react/shared/constants.js @@ -1,9 +1,6 @@ export const API_DATE_FORMAT = "yyyy-MM-dd"; export const API_TIME_FORMAT = "HH:mm:ss"; export const API_DATETIME_FORMAT = API_DATE_FORMAT + " " + API_TIME_FORMAT; -export const API_DATE_FORMAT_DAYJS = "YYYY-MM-DD"; -export const API_TIME_FORMAT_DAYJS = "HH:mm:ss"; -export const API_DATETIME_FORMAT_DAYJS = API_DATE_FORMAT_DAYJS + " " + API_TIME_FORMAT_DAYJS; export const USER_GROUP_ADMIN = 1; diff --git a/react/shared/locale.js b/react/shared/locale.js index 90a9ed2..b0bcd3a 100644 --- a/react/shared/locale.js +++ b/react/shared/locale.js @@ -1,6 +1,7 @@ import React, {useReducer} from 'react'; import {createContext, useCallback, useState} from "react"; import { enUS as dateFnsEN, de as dateFnsDE } from 'date-fns/locale'; +import {getCookie, getParameter} from "./util"; const LocaleContext = createContext(null); @@ -31,7 +32,7 @@ function reducer(entries, action) { function LocaleProvider(props) { const [entries, dispatch] = useReducer(reducer, window.languageEntries || {}); - const [currentLocale, setCurrentLocale] = useState(window.languageCode || "en_US"); + const [currentLocale, setCurrentLocale] = useState(window.languageCode || getParameter("lang") || getCookie("lang") || "en_US"); const translate = useCallback((key, defaultTranslation = null) => { diff --git a/react/shared/util.js b/react/shared/util.js index c8c0e0d..f8d9b47 100644 --- a/react/shared/util.js +++ b/react/shared/util.js @@ -46,6 +46,16 @@ const getParameter = (key) => { } } +const getCookie = (name) => { + let cookieString = decodeURIComponent(document.cookie); + let match = cookieString.match(new RegExp('(^| )' + name + '=([^;]+)')); + if (match) { + return match[2]; + } else { + return null; + } +} + const encodeText = (str) => { return Uint8Array.from(str, c => c.charCodeAt(0)); } @@ -87,7 +97,6 @@ function formatDistance(dateFns, apiDate) { return formatDistanceDateFns(toDate(apiDate), new Date(), { addSuffix: true, locale: dateFns }); } - const upperFirstChars = (str) => { return str.split(" ") .map(block => block.charAt(0).toUpperCase() + block.substring(1)) @@ -100,7 +109,7 @@ const isInt = (value) => { !isNaN(parseInt(value, 10)); } -export { humanReadableSize, removeParameter, getParameter, +export { humanReadableSize, removeParameter, getParameter, getCookie, encodeText, decodeText, getBaseUrl, formatDate, formatDateTime, formatDistance, upperFirstChars, isInt, createDownload }; \ No newline at end of file