diff --git a/Dockerfile b/Dockerfile index 5c49f9c..9c226ed 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,6 +1,6 @@ # syntax=docker/dockerfile:1 # Build commands: -# - $VERSION=1.6 +# - $VERSION=1.7 # - rm build -r -Force ; rm ./node_modules/.cache/babel-loader -r -Force ; yarn build # - docker build --pull --rm -t oncharterliz/multi-frigate:latest -t oncharterliz/multi-frigate:$VERSION "." # - docker image push --all-tags oncharterliz/multi-frigate diff --git a/package.json b/package.json index edcea52..dcaad8a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "multi-frigate", - "version": "0.1.6", + "version": "0.1.7", "private": true, "dependencies": { "@cycjimmy/jsmpeg-player": "^6.0.5", diff --git a/src/App.tsx b/src/App.tsx index 8dd32b5..d4b76d7 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -64,6 +64,17 @@ function App() { radius: "xl", } }, + ActionIcon: { + styles: (theme) => ({ + root: { + // backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[4], + '&:hover': { + backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[2], + }, + }, + }), + } + } }} > diff --git a/src/shared/components/SideBar.tsx b/src/shared/components/SideBar.tsx deleted file mode 100644 index 3fffcbd..0000000 --- a/src/shared/components/SideBar.tsx +++ /dev/null @@ -1,120 +0,0 @@ -import { Aside, Button, Navbar, createStyles } from "@mantine/core"; -import { useDisclosure } from "@mantine/hooks"; -import { observer } from 'mobx-react-lite'; -import React, { useContext, useEffect, useState } from 'react'; -import { useTranslation } from "react-i18next"; -import { Context } from '../..'; -import { dimensions } from '../dimensions/dimensions'; -import { useMantineSize } from '../utils/mantine.size.convertor'; -import { SideButton } from './SideButton'; - -// export interface SideBarProps { -// onChangeHidden: (isHidden: boolean) => void, -// side: 'left' | 'right', -// children?: React.ReactNode, -// } - -// const useStyles = createStyles((theme, -// { visible }: { visible: boolean }) => ({ -// navbar: { -// transition: 'transform 0.3s ease-in-out', -// transform: visible ? 'translateX(0)' : 'translateX(-100%)', -// }, - -// aside: { -// transition: 'transform 0.3s ease-in-out', -// transform: visible ? 'translateX(0)' : 'translateX(+100%)', -// }, -// })) - - -// const SideBar = ({ onChangeHidden: isHidden, side, children }: SideBarProps) => { -// const { t } = useTranslation() -// const hideSizePx = useMantineSize(dimensions.hideSidebarsSize) -// const initialVisible = () => { -// const savedVisibility = localStorage.getItem(`sidebarVisible_${side}`); -// if (savedVisibility === null) { -// return window.innerWidth < hideSizePx; -// } -// return savedVisibility === 'true'; -// } -// const [visible, { open, close }] = useDisclosure(initialVisible()); - -// const { classes } = useStyles({ visible }) - -// const handleClickVisible = (state: boolean) => { -// localStorage.setItem(`sidebarVisible_${side}`, String(state)) -// if (state) open() -// else close() -// } - -// const { sideBarsStore } = useContext(Context) -// useEffect(() => { -// if (sideBarsStore.rightVisible && side === 'right' && !visible) { -// open() -// } else if (!sideBarsStore.rightVisible && side === 'right' && visible) { -// close() -// } -// }, [sideBarsStore.rightVisible]) - -// const [leftChildren, setLeftChildren] = useState(() => { -// if (children && side === 'left') return children -// else if (sideBarsStore.leftChildren) return sideBarsStore.leftChildren -// return null -// }) -// const [rightChildren, setRightChildren] = useState(() => { -// if (children && side === 'right') return children -// else if (sideBarsStore.rightChildren) return sideBarsStore.rightChildren -// return null -// }) - -// useEffect(() => { -// setLeftChildren(sideBarsStore.leftChildren) -// }, [sideBarsStore.leftChildren]) - -// useEffect(() => { -// setRightChildren(sideBarsStore.rightChildren) -// }, [sideBarsStore.rightChildren]) - -// useEffect(() => { -// isHidden(!visible) -// }, [visible]) - -// useEffect(() => { -// const savedVisibility = localStorage.getItem(`sidebarVisible_${side}`); -// if (savedVisibility === null && window.innerWidth < hideSizePx) { -// open() -// } else if (savedVisibility) { -// savedVisibility === 'true' ? open() : close() -// } -// }, []) - -// return ( -//
-// { -// side === 'left' ? -// -// -// {leftChildren} -// -// : -// -// } -// handleClickVisible(true)} /> -//
-// ) -// } - -export const toDoDelete = () => ( <> ) - -// export default observer(SideBar) \ No newline at end of file diff --git a/src/shared/components/filters/CreatableMultiSelect.tsx b/src/shared/components/filters/CreatableMultiSelect.tsx index 4889a59..b8b6a32 100644 --- a/src/shared/components/filters/CreatableMultiSelect.tsx +++ b/src/shared/components/filters/CreatableMultiSelect.tsx @@ -1,4 +1,4 @@ -import { Box, Flex, Group, MultiSelect, MultiSelectProps, SelectItem, SpacingValue, SystemProp, Text } from '@mantine/core'; +import { ActionIcon, Box, Flex, Group, MultiSelect, MultiSelectProps, SelectItem, SpacingValue, SystemProp, Text } from '@mantine/core'; import React, { CSSProperties, forwardRef } from 'react'; import { useTranslation } from 'react-i18next'; import CloseWithTooltip from '../buttons/CloseWithTooltip'; @@ -28,20 +28,24 @@ interface ItemProps extends React.ComponentPropsWithoutRef<'div'> { } const DeletableItem = forwardRef( - ({ label, value, onTrashClick, ...others }, ref) => ( -
- - {label} - { - e.preventDefault(); - e.stopPropagation(); - if (onTrashClick) onTrashClick(value); - }} - /> - -
- ) + ({ label, value, onTrashClick, ...others }, ref) => { + const handleTrashClick = (e: React.MouseEvent) => { + e.preventDefault(); + e.stopPropagation(); + if (onTrashClick) onTrashClick(value); + } + return ( +
+ + {label} + + + + +
+ ) + + } ); const CreatableMultiSelect: React.FC = ({ diff --git a/src/shared/components/filters/UserTagsFilter.tsx b/src/shared/components/filters/UserTagsFilter.tsx index 54394f4..14fa8a4 100644 --- a/src/shared/components/filters/UserTagsFilter.tsx +++ b/src/shared/components/filters/UserTagsFilter.tsx @@ -123,13 +123,11 @@ const UserTagsFilter: React.FC = ({ if (typeof query === 'string') { if (!validateNewTag(query)) return undefined saveNewTag(query) - // return query } else if (parseQuery.success) { const parsedQuery = parseQuery.data as SelectItem if (!validateNewTag(parsedQuery.value)) return undefined saveNewTag(parsedQuery.value) - // return parsedQuery } } diff --git a/src/shared/stores/sidebars.store.ts b/src/shared/stores/sidebars.store.ts deleted file mode 100644 index 175adfe..0000000 --- a/src/shared/stores/sidebars.store.ts +++ /dev/null @@ -1,47 +0,0 @@ -import { action, makeAutoObservable } from "mobx" - - -// TODO Delete -export class SideBarsStore { - - // private _rightVisible: boolean = true - // public get rightVisible(): boolean { - // return this._rightVisible - // } - // public set rightVisible(visible: boolean) { - // this._rightVisible = visible - // } - // private _leftVisible: boolean = true - // public get leftVisible(): boolean { - // return this._leftVisible - // } - // public set leftVisible(visible: boolean) { - // this._leftVisible = visible - // } - - // private _leftChildren: React.ReactNode = null - // public get leftChildren(): React.ReactNode { - // return this._leftChildren - // } - - - // private _rightChildren: React.ReactNode = null - // public get rightChildren(): React.ReactNode { - // return this._rightChildren - // } - - // constructor () { - // makeAutoObservable(this, { - // setRightChildren: action, - // setLeftChildren: action, - // }) - // } - - // setRightChildren = (value: React.ReactNode) => { - // this._rightChildren = value - // } - - // setLeftChildren = (value: React.ReactNode) => { - // this._leftChildren = value - // } -} \ No newline at end of file