mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-01 02:13:33 +00:00
Migrate to Mantine v8 and Design Changes (#961)
* mantine v8 migration * various design changes and improvements
This commit is contained in:
parent
bea55d48a8
commit
c1330d92b2
473 changed files with 12469 additions and 11607 deletions
|
|
@ -1,12 +1,13 @@
|
|||
import { Group, Stack } from '@mantine/core';
|
||||
import { AnimatePresence, motion } from 'framer-motion';
|
||||
import { RiAddFill, RiAddLine, RiDeleteBinFill, RiMore2Line, RiRestartLine } from 'react-icons/ri';
|
||||
import { AnimatePresence, motion } from 'motion/react';
|
||||
|
||||
import i18n from '/@/i18n/i18n';
|
||||
import { Button } from '/@/renderer/components/button';
|
||||
import { DropdownMenu } from '/@/renderer/components/dropdown-menu';
|
||||
import { QueryBuilderOption } from '/@/renderer/components/query-builder/query-builder-option';
|
||||
import { Select } from '/@/renderer/components/select';
|
||||
import { ActionIcon } from '/@/shared/components/action-icon/action-icon';
|
||||
import { DropdownMenu } from '/@/shared/components/dropdown-menu/dropdown-menu';
|
||||
import { Group } from '/@/shared/components/group/group';
|
||||
import { Icon } from '/@/shared/components/icon/icon';
|
||||
import { Select } from '/@/shared/components/select/select';
|
||||
import { Stack } from '/@/shared/components/stack/stack';
|
||||
import { QueryBuilderGroup, QueryBuilderRule } from '/@/shared/types/types';
|
||||
|
||||
const FILTER_GROUP_OPTIONS_DATA = [
|
||||
|
|
@ -99,10 +100,10 @@ export const QueryBuilder = ({
|
|||
|
||||
return (
|
||||
<Stack
|
||||
gap="sm"
|
||||
ml={`${level * 10}px`}
|
||||
spacing="sm"
|
||||
>
|
||||
<Group spacing="sm">
|
||||
<Group gap="sm">
|
||||
<Select
|
||||
data={FILTER_GROUP_OPTIONS_DATA}
|
||||
maxWidth={175}
|
||||
|
|
@ -111,28 +112,26 @@ export const QueryBuilder = ({
|
|||
value={data.type}
|
||||
width="20%"
|
||||
/>
|
||||
<Button
|
||||
<ActionIcon
|
||||
icon="add"
|
||||
onClick={handleAddRule}
|
||||
px={5}
|
||||
size="sm"
|
||||
tooltip={{ label: 'Add rule' }}
|
||||
variant="default"
|
||||
>
|
||||
<RiAddLine size={20} />
|
||||
</Button>
|
||||
variant="subtle"
|
||||
/>
|
||||
<DropdownMenu position="bottom-start">
|
||||
<DropdownMenu.Target>
|
||||
<Button
|
||||
p={0}
|
||||
<ActionIcon
|
||||
icon="ellipsisVertical"
|
||||
size="sm"
|
||||
style={{
|
||||
padding: 0,
|
||||
}}
|
||||
variant="subtle"
|
||||
>
|
||||
<RiMore2Line size={20} />
|
||||
</Button>
|
||||
/>
|
||||
</DropdownMenu.Target>
|
||||
<DropdownMenu.Dropdown>
|
||||
<DropdownMenu.Item
|
||||
icon={<RiAddFill />}
|
||||
leftSection={<Icon icon="add" />}
|
||||
onClick={handleAddRuleGroup}
|
||||
>
|
||||
Add rule group
|
||||
|
|
@ -140,7 +139,7 @@ export const QueryBuilder = ({
|
|||
|
||||
{level > 0 && (
|
||||
<DropdownMenu.Item
|
||||
icon={<RiDeleteBinFill />}
|
||||
leftSection={<Icon icon="delete" />}
|
||||
onClick={handleDeleteRuleGroup}
|
||||
>
|
||||
Remove rule group
|
||||
|
|
@ -150,15 +149,25 @@ export const QueryBuilder = ({
|
|||
<>
|
||||
<DropdownMenu.Divider />
|
||||
<DropdownMenu.Item
|
||||
$danger
|
||||
icon={<RiRestartLine color="var(--danger-color)" />}
|
||||
isDanger
|
||||
leftSection={
|
||||
<Icon
|
||||
color="error"
|
||||
icon="refresh"
|
||||
/>
|
||||
}
|
||||
onClick={onResetFilters}
|
||||
>
|
||||
Reset to default
|
||||
</DropdownMenu.Item>
|
||||
<DropdownMenu.Item
|
||||
$danger
|
||||
icon={<RiDeleteBinFill color="var(--danger-color)" />}
|
||||
isDanger
|
||||
leftSection={
|
||||
<Icon
|
||||
color="error"
|
||||
icon="delete"
|
||||
/>
|
||||
}
|
||||
onClick={onClearFilters}
|
||||
>
|
||||
Clear filters
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue