replaced dayjs with date-fns
This commit is contained in:
		
							parent
							
								
									5da644acce
								
							
						
					
					
						commit
						ec7fb0ecc3
					
				
							
								
								
									
										10
									
								
								README.md
									
									
									
									
									
								
							
							
								
								
								
								
								
									
									
								
							
						
						
									
										10
									
								
								README.md
									
									
									
									
									
								
							| @ -166,13 +166,13 @@ A static route targets a file, usually located in [/static](/static) and does no | |||||||
| It takes two parameters, firstly the target document and secondly, an optional view. For example, take the following routing table: | It takes two parameters, firstly the target document and secondly, an optional view. For example, take the following routing table: | ||||||
| 
 | 
 | ||||||
| | Route                     | Action | Target | Extra   | | | Route                     | Action | Target | Extra   | | ||||||
| | ----- | ------ | ------ | ----- | | |---------------------------| ------ | ------ |---------| | ||||||
| | `/funnyCatImage`          | `Serve Static` | `/static/cat.jpg` |         | | | `/funnyCatImage`          | `Serve Static` | `/static/cat.jpg` |         | | ||||||
| | `/someRoute(/(.*))?` | `Redirect Dynamic` | `\Documents\MyDocument\` | `$2` | | | `/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 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. | 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 group (`$2`), which is all the text after the last slash (or `null`) to the dynamically loaded document `MyDocument`. | 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 | ### Creating and Modifying documents | ||||||
| 
 | 
 | ||||||
| @ -299,7 +299,6 @@ php cli.php db migrate Patch/SomePatch | |||||||
| 
 | 
 | ||||||
| ### Route commands | ### Route commands | ||||||
| ```bash | ```bash | ||||||
| # Route commands |  | ||||||
| php cli.php routes list | php cli.php routes list | ||||||
| php cli.php routes remove 1 | php cli.php routes remove 1 | ||||||
| php cli.php routes enable 1 | php cli.php routes enable 1 | ||||||
| @ -310,7 +309,6 @@ php cli.php routes modify 1 '/regex(/.*)?' dynamic '\\Documents\\Test' | |||||||
| 
 | 
 | ||||||
| ### Frontend commands | ### Frontend commands | ||||||
| ```bash | ```bash | ||||||
| # Frontend commands |  | ||||||
| php cli.php frontend build | php cli.php frontend build | ||||||
| php cli.php frontend ls | php cli.php frontend ls | ||||||
| php cli.php frontend add <module-name> | php cli.php frontend add <module-name> | ||||||
|  | |||||||
| @ -1,14 +1,14 @@ | |||||||
| import {useCallback, useContext, useEffect, useState} from "react"; | import {useCallback, useContext, useEffect, useState} from "react"; | ||||||
| import {LocaleContext} from "shared/locale"; | 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 usePagination from "shared/hooks/pagination"; | ||||||
| import {DataColumn, DataTable, DateTimeColumn, NumericColumn, StringColumn} from "shared/elements/data-table"; | import {DataColumn, DataTable, DateTimeColumn, NumericColumn, StringColumn} from "shared/elements/data-table"; | ||||||
| import dayjs, { Dayjs } from 'dayjs'; | import {TextField} from "@mui/material"; | ||||||
| import {Chip, TextField} from "@mui/material"; | import {DesktopDateTimePicker} from "@mui/x-date-pickers"; | ||||||
| import {DateTimePicker} from "@mui/x-date-pickers"; | import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; | ||||||
| import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; |  | ||||||
| import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; | 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) { | export default function LogView(props) { | ||||||
| 
 | 
 | ||||||
| @ -18,7 +18,6 @@ export default function LogView(props) { | |||||||
|     const api = props.api; |     const api = props.api; | ||||||
|     const showDialog = props.showDialog; |     const showDialog = props.showDialog; | ||||||
|     const {translate: L, requestModules, currentLocale} = useContext(LocaleContext); |     const {translate: L, requestModules, currentLocale} = useContext(LocaleContext); | ||||||
|     const navigate = useNavigate(); |  | ||||||
|     const pagination = usePagination(); |     const pagination = usePagination(); | ||||||
|     const [logEntries, setLogEntries] = useState([]); |     const [logEntries, setLogEntries] = useState([]); | ||||||
| 
 | 
 | ||||||
| @ -37,7 +36,11 @@ export default function LogView(props) { | |||||||
|     }, [currentLocale]); |     }, [currentLocale]); | ||||||
| 
 | 
 | ||||||
|     const onFetchLogs = useCallback((page, count, orderBy, sortOrder) => { |     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) { |             if (res.success) { | ||||||
|                 setLogEntries(res.logs); |                 setLogEntries(res.logs); | ||||||
|                 pagination.update(res.pagination); |                 pagination.update(res.pagination); | ||||||
| @ -99,13 +102,12 @@ export default function LogView(props) { | |||||||
|                     <div className={"col-4"}> |                     <div className={"col-4"}> | ||||||
|                         <div className={"form-group"}> |                         <div className={"form-group"}> | ||||||
|                             <label>{L("log.timestamp")}</label> |                             <label>{L("log.timestamp")}</label> | ||||||
|                             <LocalizationProvider dateAdapter={AdapterDayjs}> |                             <LocalizationProvider dateAdapter={AdapterDateFns}> | ||||||
|                                 <DateTimePicker className={"form-control"} |                                 <DesktopDateTimePicker className={"form-control"} | ||||||
|                                                 label="Select date time to filter..." |                                                 label={L("Select date time to filter...")} | ||||||
|                                                 value={timestamp ? dayjs(timestamp) : null} |                                                 value={timestamp ? toDate(new Date()) : null} | ||||||
|                                                 onChange={(newValue) => {console.log(newValue); |                                                 format={L("general.datefns_datetime_format_precise")} | ||||||
|                                                     setTimestamp(newValue) |                                                 onChange={(newValue) => setTimestamp(newValue)} | ||||||
|                                                 }} |  | ||||||
|                                                 slotProps={{ textField: { size: 'small' } }} |                                                 slotProps={{ textField: { size: 'small' } }} | ||||||
|                                 /> |                                 /> | ||||||
|                             </LocalizationProvider> |                             </LocalizationProvider> | ||||||
|  | |||||||
| @ -43,7 +43,6 @@ | |||||||
|         "chart.js": "^4.0.1", |         "chart.js": "^4.0.1", | ||||||
|         "clsx": "^1.2.1", |         "clsx": "^1.2.1", | ||||||
|         "date-fns": "^2.29.3", |         "date-fns": "^2.29.3", | ||||||
|         "dayjs": "^1.11.10", |  | ||||||
|         "material-ui-color-picker": "^3.5.1", |         "material-ui-color-picker": "^3.5.1", | ||||||
|         "mini-css-extract-plugin": "^2.7.1", |         "mini-css-extract-plugin": "^2.7.1", | ||||||
|         "react": "^18.2.0", |         "react": "^18.2.0", | ||||||
|  | |||||||
| @ -1,9 +1,6 @@ | |||||||
| export const API_DATE_FORMAT = "yyyy-MM-dd"; | export const API_DATE_FORMAT = "yyyy-MM-dd"; | ||||||
| export const API_TIME_FORMAT = "HH:mm:ss"; | export const API_TIME_FORMAT = "HH:mm:ss"; | ||||||
| export const API_DATETIME_FORMAT = API_DATE_FORMAT + " " + API_TIME_FORMAT; | 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; | export const USER_GROUP_ADMIN = 1; | ||||||
|  | |||||||
| @ -1,6 +1,7 @@ | |||||||
| import React, {useReducer} from 'react'; | import React, {useReducer} from 'react'; | ||||||
| import {createContext, useCallback, useState} from "react"; | import {createContext, useCallback, useState} from "react"; | ||||||
| import { enUS as dateFnsEN, de as dateFnsDE } from 'date-fns/locale'; | import { enUS as dateFnsEN, de as dateFnsDE } from 'date-fns/locale'; | ||||||
|  | import {getCookie, getParameter} from "./util"; | ||||||
| 
 | 
 | ||||||
| const LocaleContext = createContext(null); | const LocaleContext = createContext(null); | ||||||
| 
 | 
 | ||||||
| @ -31,7 +32,7 @@ function reducer(entries, action) { | |||||||
| function LocaleProvider(props) { | function LocaleProvider(props) { | ||||||
| 
 | 
 | ||||||
|     const [entries, dispatch] = useReducer(reducer, window.languageEntries || {}); |     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) => { |     const translate = useCallback((key, defaultTranslation = null) => { | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -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) => { | const encodeText = (str) => { | ||||||
|     return Uint8Array.from(str, c => c.charCodeAt(0)); |     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 }); |     return formatDistanceDateFns(toDate(apiDate), new Date(), { addSuffix: true, locale: dateFns }); | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 |  | ||||||
| const upperFirstChars = (str) => { | const upperFirstChars = (str) => { | ||||||
|     return str.split(" ") |     return str.split(" ") | ||||||
|         .map(block => block.charAt(0).toUpperCase() + block.substring(1)) |         .map(block => block.charAt(0).toUpperCase() + block.substring(1)) | ||||||
| @ -100,7 +109,7 @@ const isInt = (value) => { | |||||||
|         !isNaN(parseInt(value, 10)); |         !isNaN(parseInt(value, 10)); | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| export { humanReadableSize, removeParameter, getParameter, | export { humanReadableSize, removeParameter, getParameter, getCookie, | ||||||
|     encodeText, decodeText, getBaseUrl, |     encodeText, decodeText, getBaseUrl, | ||||||
|     formatDate, formatDateTime, formatDistance, |     formatDate, formatDateTime, formatDistance, | ||||||
|     upperFirstChars, isInt, createDownload }; |     upperFirstChars, isInt, createDownload }; | ||||||
		Loading…
	
		Reference in New Issue
	
	Block a user