dca1a9b35d
Introduce a document identity key combining type and id for consistent identification across document operations, including selection, drag-and-drop, and folder management. Refactor drag item structures to use identity objects instead of plain ids, preventing cross-type collisions and improving merge accuracy. Update Dexie recently opened map to use identity keys. Enhance document size formatting for small files and improve error feedback in the uploader. Clean up redundant props and standardize icon SVG handling.
102 lines
2.7 KiB
TypeScript
102 lines
2.7 KiB
TypeScript
import type { SVGProps } from 'react';
|
|
|
|
type IconProps = SVGProps<SVGSVGElement>;
|
|
|
|
const baseSvg = (props: IconProps) => {
|
|
const { width = '1em', height = '1em', ...rest } = props;
|
|
return {
|
|
xmlns: 'http://www.w3.org/2000/svg',
|
|
viewBox: '0 0 24 24',
|
|
fill: 'none',
|
|
stroke: 'currentColor',
|
|
strokeWidth: 1.6,
|
|
strokeLinecap: 'round' as const,
|
|
strokeLinejoin: 'round' as const,
|
|
width,
|
|
height,
|
|
...rest,
|
|
};
|
|
};
|
|
|
|
export const SearchIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<circle cx="11" cy="11" r="6.5" />
|
|
<path d="m20 20-3.5-3.5" />
|
|
</svg>
|
|
);
|
|
|
|
export const FolderIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="M3 7.5C3 6.4 3.9 5.5 5 5.5h3.6c.5 0 1 .2 1.4.6l1.4 1.4c.4.4.9.6 1.4.6H19c1.1 0 2 .9 2 2v7c0 1.1-.9 2-2 2H5c-1.1 0-2-.9-2-2V7.5Z" />
|
|
</svg>
|
|
);
|
|
|
|
export const FolderPlusIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="M3 7.5C3 6.4 3.9 5.5 5 5.5h3.6c.5 0 1 .2 1.4.6l1.4 1.4c.4.4.9.6 1.4.6H19c1.1 0 2 .9 2 2v7c0 1.1-.9 2-2 2H5c-1.1 0-2-.9-2-2V7.5Z" />
|
|
<path d="M12 11v5M9.5 13.5h5" />
|
|
</svg>
|
|
);
|
|
|
|
export const SidebarIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<rect x="3" y="5" width="18" height="14" rx="2" />
|
|
<path d="M9 5v14" />
|
|
</svg>
|
|
);
|
|
|
|
export const IconsViewIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<rect x="4" y="4" width="6" height="6" rx="1" />
|
|
<rect x="14" y="4" width="6" height="6" rx="1" />
|
|
<rect x="4" y="14" width="6" height="6" rx="1" />
|
|
<rect x="14" y="14" width="6" height="6" rx="1" />
|
|
</svg>
|
|
);
|
|
|
|
export const ListViewIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
);
|
|
|
|
export const GalleryViewIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<rect x="3" y="4" width="18" height="11" rx="1.5" />
|
|
<rect x="4" y="17" width="4" height="3" rx="0.6" />
|
|
<rect x="10" y="17" width="4" height="3" rx="0.6" />
|
|
<rect x="16" y="17" width="4" height="3" rx="0.6" />
|
|
</svg>
|
|
);
|
|
|
|
export const ChevronRightSmall = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="m9 6 6 6-6 6" />
|
|
</svg>
|
|
);
|
|
|
|
export const ChevronLeftSmall = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="m15 6-6 6 6 6" />
|
|
</svg>
|
|
);
|
|
|
|
export const HamburgerIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="M4 7h16M4 12h16M4 17h16" />
|
|
</svg>
|
|
);
|
|
|
|
export const ClockIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<circle cx="12" cy="12" r="8.5" />
|
|
<path d="M12 7.5V12l3 2" />
|
|
</svg>
|
|
);
|
|
|
|
export const HomeIcon = (props: IconProps) => (
|
|
<svg {...baseSvg(props)}>
|
|
<path d="m3 11 9-7 9 7" />
|
|
<path d="M5 10v9a1 1 0 0 0 1 1h4v-6h4v6h4a1 1 0 0 0 1-1v-9" />
|
|
</svg>
|
|
);
|