This commit is contained in:
ajnart
2022-12-20 11:45:33 +09:00
parent 79d7042cd9
commit 4d6e6123e1
32 changed files with 74 additions and 125 deletions

View File

@@ -1,10 +1,6 @@
import { Card, Group, Title } from '@mantine/core';
import { Group, Title } from '@mantine/core';
import { CategoryType } from '../../../../types/category';
import { IWidgetDefinition } from '../../../../widgets/widgets';
import { HomarrCardWrapper } from '../../Tiles/HomarrCardWrapper';
import { Tiles } from '../../Tiles/tilesDefinitions';
import Widgets from '../../../../widgets';
import { GridstackTileWrapper } from '../../Tiles/TileWrapper';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { useGridstack } from '../gridstack/use-gridstack';
import { CategoryEditMenu } from './CategoryEditMenu';

View File

@@ -1,9 +1,5 @@
import { Card } from '@mantine/core';
import { RefObject } from 'react';
import { IWidgetDefinition } from '../../../../widgets/widgets';
import { Tiles } from '../../Tiles/tilesDefinitions';
import Widgets from '../../../../widgets';
import { GridstackTileWrapper } from '../../Tiles/TileWrapper';
import { useGridstack } from '../gridstack/use-gridstack';
import { WrapperContent } from '../WrapperContent';
@@ -38,6 +34,5 @@ export const DashboardSidebar = ({ location }: DashboardSidebarProps) => {
);
};
const useMinRowForFullHeight = (wrapperRef: RefObject<HTMLDivElement>) => {
return wrapperRef.current ? Math.floor(wrapperRef.current!.offsetHeight / 64) : 2;
};
const useMinRowForFullHeight = (wrapperRef: RefObject<HTMLDivElement>) =>
wrapperRef.current ? Math.floor(wrapperRef.current!.offsetHeight / 64) : 2;

View File

@@ -19,44 +19,44 @@ interface WrapperContentProps {
}
export const WrapperContent = ({ apps, refs, widgets }: WrapperContentProps) => (
<>
{apps?.map((app) => {
const { component: TileComponent, ...tile } = Tiles.app;
return (
<GridstackTileWrapper
id={app.id}
type="app"
key={app.id}
itemRef={refs.items.current[app.id]}
{...tile}
{...app.shape.location}
{...app.shape.size}
>
<TileComponent className="grid-stack-item-content" app={app} />
</GridstackTileWrapper>
);
})}
{widgets.map((widget) => {
const definition = Widgets[widget.id as keyof typeof Widgets] as
| IWidgetDefinition
| undefined;
if (!definition) return null;
<>
{apps?.map((app) => {
const { component: TileComponent, ...tile } = Tiles.app;
return (
<GridstackTileWrapper
id={app.id}
type="app"
key={app.id}
itemRef={refs.items.current[app.id]}
{...tile}
{...app.shape.location}
{...app.shape.size}
>
<TileComponent className="grid-stack-item-content" app={app} />
</GridstackTileWrapper>
);
})}
{widgets.map((widget) => {
const definition = Widgets[widget.id as keyof typeof Widgets] as
| IWidgetDefinition
| undefined;
if (!definition) return null;
return (
<GridstackTileWrapper
type="widget"
key={widget.id}
itemRef={refs.items.current[widget.id]}
id={definition.id}
{...definition.gridstack}
{...widget.shape.location}
{...widget.shape.size}
>
<WidgetWrapper className="grid-stack-item-content" widget={widget} widgetId={widget.id}>
<definition.component className="grid-stack-item-content" widget={widget} />
</WidgetWrapper>
</GridstackTileWrapper>
);
})}
</>
);
return (
<GridstackTileWrapper
type="widget"
key={widget.id}
itemRef={refs.items.current[widget.id]}
id={definition.id}
{...definition.gridstack}
{...widget.shape.location}
{...widget.shape.size}
>
<WidgetWrapper className="grid-stack-item-content" widget={widget} widgetId={widget.id}>
<definition.component className="grid-stack-item-content" widget={widget} />
</WidgetWrapper>
</GridstackTileWrapper>
);
})}
</>
);