diff --git a/README.md b/README.md index 2551928d..b94aae0c 100644 --- a/README.md +++ b/README.md @@ -697,12 +697,12 @@ You can find the migration instructions: --> ## Changelog -### 7.2.3 (2024-10-05) +### **WORK IN PROGRESS** -- (@GermanBluefox) Corrected error in the simple CRON dialog +- (@GermanBluefox) Corrected file browser +- (@GermanBluefox) Changed Open/Close Folder icons ### 7.2.2 (2024-10-04) - - (@GermanBluefox) Small layout change for Icon Picker ### 7.2.1 (2024-09-30) diff --git a/package.json b/package.json index c08a6c14..e2a86573 100644 --- a/package.json +++ b/package.json @@ -42,37 +42,38 @@ }, "homepage": "https://github.com/ioBroker/adapter-react-v5#readme", "dependencies": { + "@babel/plugin-proposal-class-properties": "^7.18.6", "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", - "@iobroker/socket-client": "^3.1.0", + "@iobroker/socket-client": "^3.1.1", "@iobroker/types": "^6.0.11", "@iobroker/js-controller-common": "^6.0.11", "@iobroker/js-controller-common-db": "^6.0.11", - "@mui/icons-material": "^6.1.1", - "@mui/material": "^6.1.1", - "@mui/x-date-pickers": "^7.18.0", - "@sentry/browser": "^8.32.0", + "@mui/icons-material": "^6.1.2", + "@mui/material": "^6.1.2", + "@mui/x-date-pickers": "^7.19.0", + "@sentry/browser": "^8.33.1", "cronstrue": "^2.50.0", "react-color": "^2.19.3", "react-colorful": "^5.6.1", "react-cropper": "^2.3.3", - "react-dropzone": "^14.2.3", + "react-dropzone": "^14.2.9", "react-icons": "^5.3.0", "react-inlinesvg": "^4.1.3" }, "devDependencies": { "@alcalzone/release-script": "^3.8.0", "@alcalzone/release-script-plugin-license": "^3.7.0", - "@iobroker/build-tools": "^1.1.0", + "@iobroker/build-tools": "^2.0.6", "@iobroker/eslint-config": "^0.1.6", - "@babel/core": "^7.25.2", + "@babel/core": "^7.25.7", "@babel/plugin-proposal-class-properties": "^7.18.6", - "@babel/plugin-transform-runtime": "^7.25.4", - "@babel/preset-env": "^7.25.4", - "@babel/preset-flow": "^7.24.7", - "@babel/preset-react": "^7.24.7", + "@babel/plugin-transform-runtime": "^7.25.7", + "@babel/preset-env": "^7.25.7", + "@babel/preset-flow": "^7.25.7", + "@babel/preset-react": "^7.25.7", "@types/node": "^22.7.4", - "@types/react": "^18.3.10", + "@types/react": "^18.3.11", "@types/react-color": "^3.0.12", "ajv": "^8.17.1", "ts-node": "^10.9.2", diff --git a/src/Components/FileBrowser.tsx b/src/Components/FileBrowser.tsx index 44587b7b..7c0b3e6f 100644 --- a/src/Components/FileBrowser.tsx +++ b/src/Components/FileBrowser.tsx @@ -4,7 +4,7 @@ * MIT License * */ -import React, { Component } from 'react'; +import React, { Component, type JSX } from 'react'; import Dropzone from 'react-dropzone'; import { @@ -102,9 +102,6 @@ const FILE_TYPE_ICONS: Record> = { }; const styles: Record = { - dialog: (theme: IobTheme) => ({ - height: `calc(100% - ${theme.mixins.toolbar.minHeight}px)`, - }), root: { width: '100%', overflow: 'hidden', @@ -147,7 +144,8 @@ const styles: Record = { textAlign: 'center', opacity: 0.1, transition: 'opacity 1s', - margin: 4, + margin: '4px', + borderRadius: '4px', '&:hover': { background: theme.palette.secondary.light, color: Utils.invertColor(theme.palette.secondary.main, true), @@ -270,8 +268,8 @@ const styles: Record = { opacity: 0.4, }, itemFolderIconTable: (theme: IobTheme) => ({ - marginTop: 1, - marginLeft: 8, + marginTop: '1px', + marginLeft: '8px', display: 'inline-block', width: 30, height: 30, @@ -406,6 +404,9 @@ const styles: Record = { background: theme.palette.primary.main, }, }), + pathDivBreadcrumbSelected: { + // todo: add style + }, backgroundImageLight: { background: 'white', }, @@ -500,7 +501,7 @@ export interface FileBrowserProps { restrictToFolder?: string; - modalEditOfAccessControl?: (obj: FileBrowserClass) => React.JSX.Element | null; + modalEditOfAccessControl?: (obj: FileBrowserClass) => JSX.Element | null; allowNonRestricted?: boolean; @@ -1026,7 +1027,17 @@ export class FileBrowserClass extends Component): void { + toggleFolder(item: FolderOrFileItem, e: React.MouseEvent): void { e?.stopPropagation(); const expanded = [...this.state.expanded]; const pos = expanded.indexOf(item.id); @@ -1142,9 +1153,7 @@ export class FileBrowserClass extends Component, folder?: string): void { - if (e) { - e.stopPropagation(); - } + e?.stopPropagation(); this.lastSelect = Date.now(); @@ -1157,9 +1166,11 @@ export class FileBrowserClass extends Component @@ -1178,7 +1189,7 @@ export class FileBrowserClass extends Component ) => this.toggleFolder(item, e) - : undefined + this.state.viewType === TABLE ? (e: React.MouseEvent) => this.toggleFolder(item, e) : undefined } /> @@ -1340,7 +1350,7 @@ export class FileBrowserClass extends Component - + {size || size === 0 ? Utils.formatBytes(size) : ''} @@ -1380,7 +1390,7 @@ export class FileBrowserClass extends Component { if (item.folder) { const expanded = this.state.expanded.includes(item.id); @@ -1716,7 +1726,7 @@ export class FileBrowserClass extends Component | null = this.props.showTypeSelector ? FILE_TYPE_ICONS[this.state.filterByType || 'all'] || FILE_TYPE_ICONS.all : null; @@ -1965,7 +1975,7 @@ export class FileBrowserClass extends Component item.id === id) || null; } - renderInputDialog(): React.JSX.Element | null { + renderInputDialog(): JSX.Element | null { if (this.state.addFolder) { const parentFolder = this.findFirstFolder(this.state.selected); @@ -2074,7 +2084,7 @@ export class FileBrowserClass extends Component; } diff --git a/src/Components/FileViewer.tsx b/src/Components/FileViewer.tsx index 494002d4..8c9f6333 100644 --- a/src/Components/FileViewer.tsx +++ b/src/Components/FileViewer.tsx @@ -1,6 +1,6 @@ // File viewer in adapter-react does not support write // import { Buffer } from 'buffer'; -import React, { Component } from 'react'; +import React, { Component, type JSX } from 'react'; import { TextField, Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton } from '@mui/material'; @@ -338,7 +338,7 @@ class FileViewer extends Component { return null; } - render(): React.JSX.Element { + render(): JSX.Element { return ( | null { if (obj.common && obj.common.adminColumns && obj.common.name) { - let columns: string | (string | ioBroker.CustomAdminColumn)[] = obj.common.adminColumns; + const columns: string | (string | ioBroker.CustomAdminColumn)[] = obj.common.adminColumns; + let aColumns: (string | ioBroker.CustomAdminColumn)[] | undefined; if (columns && typeof columns !== 'object') { - columns = [columns]; + aColumns = [columns]; + } else if (columns) { + aColumns = columns as (string | ioBroker.CustomAdminColumn)[]; } let cColumns: CustomAdminColumnStored[] | null; if (columns) { - cColumns = (columns as (string | ioBroker.CustomAdminColumn)[]) + cColumns = aColumns .map((_item: string | ioBroker.CustomAdminColumn) => { if (typeof _item !== 'object') { return { path: _item, name: _item.split('.').pop() }; @@ -3866,7 +3871,7 @@ export class ObjectBrowserClass extends Component item) as CustomAdminColumnStored[]; + .filter((item: CustomAdminColumnStored) => item); } else { cColumns = null; } @@ -7753,22 +7758,30 @@ export class ObjectBrowserClass extends Component item.data.id === currId); - if (!_root) { - break; + let found = false; + if (_root.children) { + for (let j = 0; j < _root.children.length; j++) { + if (_root.children[j].data.id === currId) { + _root = _root.children[j]; + found = true; + break; + } + } + } + if (!found) { + return null; } } @@ -8495,7 +8508,6 @@ export class ObjectBrowserClass extends Component - +
- +
, ); diff --git a/src/Components/Schedule.tsx b/src/Components/Schedule.tsx index f2912048..84c63c77 100644 --- a/src/Components/Schedule.tsx +++ b/src/Components/Schedule.tsx @@ -10,7 +10,7 @@ import { Select, TextField, Box, - type Theme + type Theme, } from '@mui/material'; import I18n from '../i18n'; @@ -558,14 +558,14 @@ class Schedule extends Component { // every minute desc.push(I18n.t('sch_desc_everyMinute')); } else { - // every N minutes + // every N minute desc.push(I18n.t('sch_desc_everyNMinutes', schedule.time.interval.toString())); } } else if (schedule.time.interval === 1) { // every minute desc.push(I18n.t('sch_desc_everyHour')); } else { - // every N minutes + // every N minute desc.push(I18n.t('sch_desc_everyNHours', schedule.time.interval.toString())); } @@ -767,7 +767,7 @@ class Schedule extends Component { )} - {!schedule.time.exactTime && this.getPeriodSettingsMinutes()} + {!schedule.time.exactTime && this.getPeriodSettingsMinutes(fromTo)} ); @@ -1202,13 +1202,16 @@ class Schedule extends Component { ]; } - getPeriodSettingsMinutes(): JSX.Element { + getPeriodSettingsMinutes(fromTo: boolean): JSX.Element { return ( -
- +
+ { diff --git a/src/Components/SimpleCron/index.tsx b/src/Components/SimpleCron/index.tsx index b7f3187c..68f549f9 100644 --- a/src/Components/SimpleCron/index.tsx +++ b/src/Components/SimpleCron/index.tsx @@ -1,6 +1,15 @@ import React from 'react'; -import { InputLabel, MenuItem, Select, TextField, FormControl, FormControlLabel, Checkbox, type Theme } from '@mui/material'; +import { + InputLabel, + MenuItem, + Select, + TextField, + FormControl, + FormControlLabel, + Checkbox, + type Theme, +} from '@mui/material'; import convertCronToText from './cronText'; @@ -923,7 +932,9 @@ class SimpleCron extends React.Component { />
- {this.state.cron.includes('_') ? I18n.t('sc_invalid_cron') : convertCronToText(this.state.cron, this.props.language || 'en')} + {this.state.cron.includes('_') + ? I18n.t('sc_invalid_cron') + : convertCronToText(this.state.cron, this.props.language || 'en')}
( > ); diff --git a/src/icons/IconOpen.tsx b/src/icons/IconOpen.tsx index 25cfcbb6..e77ec5de 100644 --- a/src/icons/IconOpen.tsx +++ b/src/icons/IconOpen.tsx @@ -14,7 +14,7 @@ const IconOpen = (props: IconProps): JSX.Element => ( > ); diff --git a/test-gui/src/App.tsx b/test-gui/src/App.tsx index 05f24464..287f70ca 100644 --- a/test-gui/src/App.tsx +++ b/test-gui/src/App.tsx @@ -19,7 +19,7 @@ import langPl from '../../src/i18n/pl.json'; import langUk from '../../src/i18n/uk.json'; import langZhCn from '../../src/i18n/zh-cn.json'; import I18n from '../../src/i18n'; -import SimpleCron from '../../src/Dialogs/SimpleCron'; +import Cron from '../../src/Dialogs/Cron'; class App extends Component { private theme: Theme; @@ -52,10 +52,11 @@ class App extends Component { return ( - {}} onOk={() => {}} cron="0 0 * * *" + theme={this.theme} />