Skip to content

Commit 504d790

Browse files
DeykunDeykun
committed
Filters seeds global update
1 parent 6033277 commit 504d790

9 files changed

Lines changed: 179 additions & 59 deletions

File tree

‎src/topic/Heraldry/components/Panes/DevelopmentPane/DevelopmentPaneSidebarListOfFilters.tsx‎

Lines changed: 11 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,8 @@ import {
99
import { useTranslation } from "react-i18next";
1010

1111
import IconCopy from "@/components/Icons/IconCopy";
12-
import IconEraser from "@/components/Icons/IconEraser";
1312
import IconSelected from "@/components/Icons/IconSelected";
1413
import IconSelectNew from "@/components/Icons/IconSelectNew";
15-
import IconAnimal from "@/components/Icons/IconAnimal";
16-
import IconCrown from "@/components/Icons/IconCrown";
1714

1815
import Space from "@/components/UI/Space";
1916
import ButtonText from "@/components/UI/ButtonText";
@@ -25,32 +22,28 @@ import { copyText } from "@/utils/text";
2522
import { MarkerParamsWithResult } from "@/topic/Heraldry/types";
2623

2724
import FilterModifications from "@/topic/Heraldry/features/modifyMarkers/components/DevelopmentPaneSidebarListOfFilters/FilterModifications";
28-
import {
29-
useFilterModificationStore,
30-
selectShortcuts,
31-
resetModifications,
32-
} from "@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore";
3325

3426
import DevelopmentPaneSnippet from "./DevelopmentPaneSnippet";
3527
import FilterSelect from "./ListOfFilters/FilterSelect";
28+
import ShortcutsSelect from "./ListOfFilters/ShortcutsSelect";
29+
import FilterSeeds from "./ListOfFilters/FilterSeeds";
3630

3731
type Props = {
3832
country: string;
3933
setDraftFilter: Dispatch<SetStateAction<MarkerParamsWithResult>>;
4034
onUse: () => void;
4135
};
4236

37+
export type SelectState =
38+
| { type: "type" | "animal" | "item"; name: string }
39+
| undefined;
40+
4341
const DevelopmentPaneSidebarListOfFilters = ({
4442
country,
4543
setDraftFilter,
4644
onUse,
4745
}: Props) => {
48-
const shortcuts = useFilterModificationStore((state) =>
49-
selectShortcuts(state, 100)
50-
);
51-
const [selected, setSelected] = useState<
52-
{ type: "type" | "animal" | "item"; name: string } | undefined
53-
>();
46+
const [selected, setSelected] = useState<SelectState>();
5447
const { t } = useTranslation();
5548

5649
const handleDraftUpdate = useCallback(
@@ -61,7 +54,7 @@ const DevelopmentPaneSidebarListOfFilters = ({
6154
[onUse, setDraftFilter]
6255
);
6356

64-
const { isLoading, isError, error, data } = useQueryFiltersSeeds({ country });
57+
const { isError, error, data } = useQueryFiltersSeeds({ country });
6558

6659
const handleChange = useCallback(
6760
(event: React.ChangeEvent<HTMLSelectElement>) => {
@@ -125,38 +118,13 @@ const DevelopmentPaneSidebarListOfFilters = ({
125118
<a
126119
href="https://github.com/Deykun/maps/blob/main/docs/FILTERS.md"
127120
target="_blank"
128-
className="font-[500] text-white"
121+
className="font-[500] text-white underline"
129122
>
130123
here
131124
</a>
132125
{". "}
133126
</p>
134-
{shortcuts.length > 0 && (
135-
<div className="flex gap-2 flex-wrap">
136-
<ButtonText size="small" onClick={resetModifications}>
137-
<IconEraser />
138-
<span>{t("heraldry.list.clear")}</span>
139-
</ButtonText>
140-
{shortcuts.map(({ name, type, total }) => (
141-
<ButtonText
142-
size="small"
143-
key={name}
144-
onClick={() => setSelected({ name, type })}
145-
isActive={selected?.name === name && selected?.type === type}
146-
isDisabled={!data}
147-
>
148-
{type === "animal" ? (
149-
<IconAnimal animals={[name]} />
150-
) : (
151-
<IconCrown />
152-
)}
153-
<span>
154-
{t(`heraldry.${type}.${name}`)} <small>({total})</small>
155-
</span>
156-
</ButtonText>
157-
))}
158-
</div>
159-
)}
127+
<ShortcutsSelect selected={selected} setSelected={setSelected} />
160128
<FilterSelect country={country} setSelected={setSelected} />
161129
<div className="flex gap-2">
162130
{selectedFilter && (
@@ -198,6 +166,7 @@ const DevelopmentPaneSidebarListOfFilters = ({
198166
setDraftFilter={handleDraftUpdate}
199167
/>
200168
)}
169+
<FilterSeeds country={country} />
201170
</div>
202171
<Space side="left" isLast isLarge className="bg-ui-dark mb-5" />
203172
</div>

‎src/topic/Heraldry/components/Panes/DevelopmentPane/ListOfFilters/FilterSeeds.tsx‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
import { memo } from "react";
2+
3+
import IconCopy from "@/components/Icons/IconCopy";
4+
import IconSelected from "@/components/Icons/IconSelected";
5+
import {
6+
useFilterModificationStore,
7+
selectShortcuts,
8+
} from "@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore";
9+
import ButtonText from "@/components/UI/ButtonText";
10+
import { copyText } from "@/utils/text";
11+
import useQueryFiltersSeeds from "@/topic/Heraldry/features/modify/hooks/useQueryFiltersSeeds";
12+
import { MarkerParams } from "@/topic/Heraldry/types";
13+
import { getMergedFilterData } from "@/topic/Heraldry/features/modifyMarkers/utils/get-merged-filter-data";
14+
15+
type Props = {
16+
country: string;
17+
};
18+
19+
const FilterSeeds = ({ country }: Props) => {
20+
const shortcuts = useFilterModificationStore((state) =>
21+
selectShortcuts(state, 500)
22+
);
23+
const { data } = useQueryFiltersSeeds({ country });
24+
25+
const handleClickCopy = () => {
26+
if (!data) {
27+
return;
28+
}
29+
30+
const modifications = useFilterModificationStore.getState();
31+
32+
const newData: {
33+
types: MarkerParams[];
34+
animals: MarkerParams[];
35+
items: MarkerParams[];
36+
} = JSON.parse(JSON.stringify(data));
37+
38+
shortcuts.forEach(({ type, name }) => {
39+
let typeKey: "animals" | "items" | undefined;
40+
if (type === "animal") {
41+
typeKey = "animals";
42+
} else if (type === "item") {
43+
typeKey = "items";
44+
}
45+
46+
if (typeKey) {
47+
const { include = [], exclude = [] } = modifications[type][name] || {};
48+
49+
if (newData[typeKey].some((filter) => filter.name === name)) {
50+
newData[typeKey].map((filter) =>
51+
filter.name === name
52+
? getMergedFilterData({
53+
initFilter: filter,
54+
include,
55+
exclude,
56+
})
57+
: filter
58+
);
59+
} else {
60+
newData[typeKey].push({
61+
name,
62+
phrases: [],
63+
include,
64+
exclude,
65+
});
66+
}
67+
}
68+
});
69+
70+
copyText(`${JSON.stringify(newData, null, 4)},`);
71+
};
72+
73+
if (shortcuts.length === 0) {
74+
return null;
75+
}
76+
77+
return (
78+
<div className="flex gap-2">
79+
<h3 className="flex gap-3 items-center text-[14px]">
80+
<IconSelected className="size-5 text-white" />
81+
<span>Filters seeds</span>
82+
</h3>
83+
<ButtonText
84+
wrapperClassName="ml-auto"
85+
onClick={handleClickCopy}
86+
size="small"
87+
isActive
88+
>
89+
<span>Copy seed</span>
90+
<IconCopy />
91+
</ButtonText>
92+
</div>
93+
);
94+
};
95+
96+
export default memo(FilterSeeds);

‎src/topic/Heraldry/components/Panes/DevelopmentPane/ListOfFilters/ShortcutsSelect.tsx‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import { memo } from "react";
2+
import { useTranslation } from "react-i18next";
3+
4+
import IconEraser from "@/components/Icons/IconEraser";
5+
import IconAnimal from "@/components/Icons/IconAnimal";
6+
import IconCrown from "@/components/Icons/IconCrown";
7+
8+
import ButtonText from "@/components/UI/ButtonText";
9+
import {
10+
useFilterModificationStore,
11+
selectShortcuts,
12+
resetModifications,
13+
} from "@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore";
14+
15+
import { SelectState } from "../DevelopmentPaneSidebarListOfFilters";
16+
17+
type Props = {
18+
selected: SelectState,
19+
setSelected: (selected: SelectState) => void;
20+
};
21+
22+
const ShortcutsSelect = ({ selected, setSelected }: Props) => {
23+
const { t } = useTranslation();
24+
const shortcuts = useFilterModificationStore((state) =>
25+
selectShortcuts(state, 100)
26+
);
27+
28+
if (shortcuts.length === 0) {
29+
return null;
30+
}
31+
32+
return (
33+
<div className="flex gap-2 flex-wrap">
34+
<ButtonText size="small" onClick={resetModifications}>
35+
<IconEraser />
36+
<span>{t("heraldry.list.clear")}</span>
37+
</ButtonText>
38+
{shortcuts.map(({ name, type, total }) => (
39+
<ButtonText
40+
size="small"
41+
key={name}
42+
onClick={() => setSelected({ name, type })}
43+
isActive={selected?.name === name && selected?.type === type}
44+
>
45+
{type === "animal" ? <IconAnimal animals={[name]} /> : <IconCrown />}
46+
<span>
47+
{t(`heraldry.${type}.${name}`)} <small>({total})</small>
48+
</span>
49+
</ButtonText>
50+
))}
51+
</div>
52+
);
53+
};
54+
55+
export default memo(ShortcutsSelect);

‎src/topic/Heraldry/components/Panes/FiltersPane/FiltersPaneSubPanelSettings.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import ButtonIcon from '@/components/UI/ButtonIcon';
1616
import useFiltersStore, { toggleFilterOperator, toggleShouldReverseFilters, toggleShouldHideMissingImages } from '@/topic/Heraldry/stores/filtersStore';
1717
import {
1818
useFiltersDevelopmentStore,
19-
toggleFilterDevlopmentMode,
19+
toggleFilterDevelopmentMode,
2020
} from '@/topic/Heraldry/stores/filtersDevelopmentStore';
2121

2222
type Props = {
@@ -69,7 +69,7 @@ const FiltersPaneSubPanelColors = ({
6969
<span className="border-l"></span>
7070
<ButtonIcon
7171
isActive={isFiltersDevModeActive}
72-
onClick={toggleFilterDevlopmentMode}
72+
onClick={toggleFilterDevelopmentMode}
7373
label="Development mode"
7474
labelPosition="bottomLeft"
7575
>

‎src/topic/Heraldry/features/modifyMarkers/components/AddOrRemoveMarkers/AddMarkers/AddOrRemoveMarkersAddShortcuts.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { CoatOfArmsMapData } from '@/topic/Heraldry/types';
55
import {
66
useFilterModificationStore,
77
includeUnitInMarker,
8-
selectUnitIncludeModifictions,
8+
selectUnitIncludeModifications,
99
selectShortcuts,
1010
} from '@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore';
1111
import useGetUnitMarkersFromCache from '@/topic/Heraldry/features/modify/hooks/useGetUnitMarkersFromCache';
@@ -20,8 +20,8 @@ type Props = {
2020
}
2121

2222
const AddOrRemoveMarkersSection = ({ unit }: Props) => {
23-
const includeAnimal = useFilterModificationStore(selectUnitIncludeModifictions(unit, 'animal'));
24-
const includeItem = useFilterModificationStore(selectUnitIncludeModifictions(unit, 'item'));
23+
const includeAnimal = useFilterModificationStore(selectUnitIncludeModifications(unit, 'animal'));
24+
const includeItem = useFilterModificationStore(selectUnitIncludeModifications(unit, 'item'));
2525
const {
2626
animals,
2727
items,

‎src/topic/Heraldry/features/modifyMarkers/components/AddOrRemoveMarkers/RemoveMarkers/RemoveMarkers.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import IconCrown from '@/components/Icons/IconCrown';
1212
import ButtonText from '@/components/UI/ButtonText';
1313

1414

15-
import { useFilterModificationStore, excludeUnitFromMarker, selectUnitExcludeModifictions } from '@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore';
15+
import { useFilterModificationStore, excludeUnitFromMarker, selectUnitExcludeModifications } from '@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore';
1616

1717
import useGetUnitMarkersFromCache from '@/topic/Heraldry/features/modify/hooks/useGetUnitMarkersFromCache';
1818

@@ -22,8 +22,8 @@ type Props = {
2222
}
2323

2424
const RemoveMarkers = ({ unit }: Props) => {
25-
const excludedAnimal = useFilterModificationStore(selectUnitExcludeModifictions(unit, 'animal'));
26-
const excludeItem = useFilterModificationStore(selectUnitExcludeModifictions(unit, 'item'));
25+
const excludedAnimal = useFilterModificationStore(selectUnitExcludeModifications(unit, 'animal'));
26+
const excludeItem = useFilterModificationStore(selectUnitExcludeModifications(unit, 'item'));
2727

2828
const { t } = useTranslation();
2929

‎src/topic/Heraldry/features/modifyMarkers/components/AddOrRemoveMarkers/RemoveModifications/RemoveModifications.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ import ButtonText from '@/components/UI/ButtonText';
1212

1313
import {
1414
useFilterModificationStore,
15-
selectUnitExcludeModifictions,
16-
selectUnitIncludeModifictions,
15+
selectUnitExcludeModifications,
16+
selectUnitIncludeModifications,
1717
removeFromIncludeAndExcludeInMarker,
1818
} from '@/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore';
1919

@@ -24,10 +24,10 @@ type Props = {
2424
const buttonClassName = 'hover:!bg-[#ff00004f]';
2525

2626
const RemoveModifications = ({ unit }: Props) => {
27-
const includeAnimal = useFilterModificationStore(selectUnitIncludeModifictions(unit, 'animal'));
28-
const includeItem = useFilterModificationStore(selectUnitIncludeModifictions(unit, 'item'));
29-
const excludedAnimal = useFilterModificationStore(selectUnitExcludeModifictions(unit, 'animal'));
30-
const excludeItem = useFilterModificationStore(selectUnitExcludeModifictions(unit, 'item'));
27+
const includeAnimal = useFilterModificationStore(selectUnitIncludeModifications(unit, 'animal'));
28+
const includeItem = useFilterModificationStore(selectUnitIncludeModifications(unit, 'item'));
29+
const excludedAnimal = useFilterModificationStore(selectUnitExcludeModifications(unit, 'animal'));
30+
const excludeItem = useFilterModificationStore(selectUnitExcludeModifications(unit, 'item'));
3131

3232
const { t } = useTranslation();
3333

‎src/topic/Heraldry/features/modifyMarkers/stores/filtersModificationStore.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -133,9 +133,9 @@ const getListForUnit =
133133
return list;
134134
};
135135

136-
export const selectUnitExcludeModifictions = getListForUnit("exclude");
136+
export const selectUnitExcludeModifications = getListForUnit("exclude");
137137

138-
export const selectUnitIncludeModifictions = getListForUnit("include");
138+
export const selectUnitIncludeModifications = getListForUnit("include");
139139

140140
type Shortcut = { name: string; type: "animal" | "item"; total: number };
141141

‎src/topic/Heraldry/stores/filtersDevelopmentStore.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export const useFiltersDevelopmentStore = create<FiltersDevelopmentStoreState>()
3434
)
3535
)
3636

37-
export const toggleFilterDevlopmentMode = () => {
37+
export const toggleFilterDevelopmentMode = () => {
3838
useFiltersDevelopmentStore.setState((state) => ({
3939
...state,
4040
isModeActive: !state.isModeActive,

0 commit comments

Comments
 (0)