glyphdiff.com/frontend-svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(FilterFonts): join all the filters in one feature

Browse Source
This commit is contained in:
Ilia Mashkov
2026-01-03 13:54:27 +03:00
parent 53baacf05a
commit e01a746460
13 changed files with 102 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/features/CategoryFilter/index.ts
View File

@@ -1,7 +0,0 @@
import { FONT_CATEGORIES } from './model/state';
import { categoryFilterStore } from './store/categoryFilterStore';
export {
categoryFilterStore,
FONT_CATEGORIES,
};

40
src/features/CategoryFilter/model/state.ts
View File

@@ -1,40 +0,0 @@
import type {
FilterModel,
Property,
} from '$shared/store/createFilterStore';
/**
* Model of state for CategoryFilter
*/
export type CategoryFilterModel = FilterModel;
export const FONT_CATEGORIES: Property[] = [
{
id: 'serif',
name: 'Serif',
},
{
id: 'sans-serif',
name: 'Sans-serif',
},
{
id: 'display',
name: 'Display',
},
{
id: 'handwriting',
name: 'Handwriting',
},
{
id: 'monospace',
name: 'Monospace',
},
{
id: 'script',
name: 'Script',
},
{
id: 'slab',
name: 'Slab',
},
] as const;

5
src/features/FilterFonts/index.ts Normal file
View File

@@ -0,0 +1,5 @@
export { categoryFilterStore } from './model/stores/categoryFilterStore';
export { providersFilterStore } from './model/stores/providersFilterStore';
export { subsetsFilterStore } from './model/stores/subsetsFilterStore';
export { clearAllFilters } from './model/services/clearAllFilters/clearAllFilters';

70
src/features/FilterFonts/model/const/const.ts Normal file
View File

@@ -0,0 +1,70 @@
import type { Property } from '$shared/store/createFilterStore';
export const FONT_CATEGORIES: Property[] = [
{
id: 'serif',
name: 'Serif',
},
{
id: 'sans-serif',
name: 'Sans-serif',
},
{
id: 'display',
name: 'Display',
},
{
id: 'handwriting',
name: 'Handwriting',
},
{
id: 'monospace',
name: 'Monospace',
},
{
id: 'script',
name: 'Script',
},
{
id: 'slab',
name: 'Slab',
},
] as const;
export const FONT_PROVIDERS: Property[] = [
{
id: 'google',
name: 'Google Fonts',
},
{
id: 'fontshare',
name: 'Fontshare',
},
] as const;
export const FONT_SUBSETS: Property[] = [
{
id: 'latin',
name: 'Latin',
},
{
id: 'latin-ext',
name: 'Latin Extended',
},
{
id: 'cyrillic',
name: 'Cyrillic',
},
{
id: 'greek',
name: 'Greek',
},
{
id: 'arabic',
name: 'Arabic',
},
{
id: 'devanagari',
name: 'Devanagari',
},
] as const;

9
src/features/FilterFonts/model/services/clearAllFilters/clearAllFilters.ts Normal file
View File

@@ -0,0 +1,9 @@
import { categoryFilterStore } from '../../stores/categoryFilterStore';
import { providersFilterStore } from '../../stores/providersFilterStore';
import { subsetsFilterStore } from '../../stores/subsetsFilterStore';
export function clearAllFilters() {
categoryFilterStore.deselectAllProperties();
providersFilterStore.deselectAllProperties();
subsetsFilterStore.deselectAllProperties();
}

10
src/features/CategoryFilter/store/categoryFilterStore.ts → src/features/FilterFonts/model/stores/categoryFilterStore.ts
View File

@@ -1,13 +1,13 @@
import { createFilterStore } from '$shared/store/createFilterStore';
import {
type CategoryFilterModel,
FONT_CATEGORIES,
} from '../model/state';
type FilterModel,
createFilterStore,
} from '$shared/store/createFilterStore';
import { FONT_CATEGORIES } from '../const/const';
/**
* Initial state for CategoryFilter
*/
export const initialState: CategoryFilterModel = {
export const initialState: FilterModel = {
searchQuery: '',
properties: FONT_CATEGORIES,
};

10
src/features/ProvidersFilter/store/providersFilterStore.ts → src/features/FilterFonts/model/stores/providersFilterStore.ts
View File

@@ -1,13 +1,13 @@
import { createFilterStore } from '$shared/store/createFilterStore';
import {
FONT_PROVIDERS,
type ProvidersFilterModel,
} from '../model/state';
type FilterModel,
createFilterStore,
} from '$shared/store/createFilterStore';
import { FONT_PROVIDERS } from '../const/const';
/**
* Initial state for ProvidersFilter
*/
export const initialState: ProvidersFilterModel = {
export const initialState: FilterModel = {
searchQuery: '',
properties: FONT_PROVIDERS,
};

10
src/features/SubsetsFilter/store/subsetsFilterStore.ts → src/features/FilterFonts/model/stores/subsetsFilterStore.ts
View File

@@ -1,13 +1,13 @@
import { createFilterStore } from '$shared/store/createFilterStore';
import {
FONT_SUBSETS,
type SubsetsFilterModel,
} from '../model/state';
type FilterModel,
createFilterStore,
} from '$shared/store/createFilterStore';
import { FONT_SUBSETS } from '../const/const';
/**
* Initial state for SubsetsFilter
*/
export const initialState: SubsetsFilterModel = {
const initialState: FilterModel = {
searchQuery: '',
properties: FONT_SUBSETS,
};

7
src/features/ProvidersFilter/index.ts
View File

@@ -1,7 +0,0 @@
import { FONT_PROVIDERS } from './model/state';
import { providersFilterStore } from './store/providersFilterStore';
export {
FONT_PROVIDERS,
providersFilterStore,
};

20
src/features/ProvidersFilter/model/state.ts
View File

@@ -1,20 +0,0 @@
import type {
FilterModel,
Property,
} from '$shared/store/createFilterStore';
/**
* Model of state for ProvidersFilter
*/
export type ProvidersFilterModel = FilterModel;
export const FONT_PROVIDERS: Property[] = [
{
id: 'google',
name: 'Google Fonts',
},
{
id: 'fontshare',
name: 'Fontshare',
},
] as const;

7
src/features/SubsetsFilter/index.ts
View File

@@ -1,7 +0,0 @@
import { FONT_SUBSETS } from './model/state';
import { subsetsFilterStore } from './store/subsetsFilterStore';
export {
FONT_SUBSETS,
subsetsFilterStore,
};

36
src/features/SubsetsFilter/model/state.ts
View File

@@ -1,36 +0,0 @@
import type {
FilterModel,
Property,
} from '$shared/store/createFilterStore';
/**
* Model of state for SubsetsFilter
*/
export type SubsetsFilterModel = FilterModel;
export const FONT_SUBSETS: Property[] = [
{
id: 'latin',
name: 'Latin',
},
{
id: 'latin-ext',
name: 'Latin Extended',
},
{
id: 'cyrillic',
name: 'Cyrillic',
},
{
id: 'greek',
name: 'Greek',
},
{
id: 'arabic',
name: 'Arabic',
},
{
id: 'devanagari',
name: 'Devanagari',
},
] as const;

6
src/widgets/FiltersSidebar/ui/Filters.svelte
View File

@@ -12,9 +12,9 @@
* Uses $derived for reactive access to filter states, ensuring UI updates
* when selections change through any means (sidebar, programmatically, etc.).
*/
import { categoryFilterStore } from '$features/CategoryFilter';
import { providersFilterStore } from '$features/ProvidersFilter';
import { subsetsFilterStore } from '$features/SubsetsFilter';
import { categoryFilterStore } from '$features/FilterFonts';
import { providersFilterStore } from '$features/FilterFonts';
import { subsetsFilterStore } from '$features/FilterFonts';
import CheckboxFilter from '$shared/ui/CheckboxFilter/CheckboxFilter.svelte';
/** Reactive properties from providers filter store */