Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

remove fixed filters #2257

Merged
merged 2 commits into from Mar 28, 2024
Merged

remove fixed filters #2257

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2559dfe
remove fixed filters
Brendonovich Mar 28, 2024
a61e9d4
fix: remove blank `console.log`
brxken128 Mar 28, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
19 changes: 5 additions & 14 deletions interface/app/$libraryId/favorites.tsx
View file
Open in desktop
Expand Up @@ -25,27 +25,18 @@ export function Component() {

const explorerSettingsSnapshot = explorerSettings.useSettingsSnapshot();

const fixedFilters = useMemo<SearchFilterArgs[]>(
() => [
// { object: { favorite: true } },
...(explorerSettingsSnapshot.layoutMode === 'media'
? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
: [])
],
[explorerSettingsSnapshot.layoutMode]
);

const search = useSearch({
fixedFilters
});
const search = useSearch();

const objects = useObjectsExplorerQuery({
arg: {
take: 100,
filters: [
...search.allFilters,
// TODO: Add filter to search options
{ object: { favorite: true } }
{ object: { favorite: true } },
...(explorerSettingsSnapshot.layoutMode === 'media'
? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
: [])
]
},
order: explorerSettings.useSettingsSnapshot().order
Expand Down
4 changes: 2 additions & 2 deletions interface/app/$libraryId/labels.tsx
View file
Open in desktop
Expand Up @@ -27,7 +27,7 @@ export function Component() {

// const explorerSettingsSnapshot = explorerSettings.useSettingsSnapshot();

// const fixedFilters = useMemo<SearchFilterArgs[]>(
// const filters = useMemo<SearchFilterArgs[]>(
// () => [
// ...(explorerSettingsSnapshot.layoutMode === 'media'
// ? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
Expand All @@ -36,7 +36,7 @@ export function Component() {
// [explorerSettingsSnapshot.layoutMode]
// );

const search = useSearch({});
const search = useSearch();

// const objects = useObjectsExplorerQuery({
// arg: {
Expand Down
40 changes: 15 additions & 25 deletions interface/app/$libraryId/location/$id.tsx
View file
Open in desktop
Expand Up @@ -71,7 +71,9 @@ const LocationExplorer = ({ location }: { location: Location; path?: string }) =
const { layoutMode, mediaViewWithDescendants, showHiddenFiles } =
explorerSettings.useSettingsSnapshot();

const search = useLocationSearch(explorerSettings, location);
const search = useLocationSearch(location);

const explorerSettingsSnapshot = explorerSettings.useSettingsSnapshot();

const paths = usePathsExplorerQuery({
arg: {
Expand All @@ -84,12 +86,15 @@ const LocationExplorer = ({ location }: { location: Location; path?: string }) =
path: path ?? '',
include_descendants:
search.search !== '' ||
search.dynamicFilters.length > 0 ||
search.filters.length > 0 ||
(layoutMode === 'media' && mediaViewWithDescendants)
}
}
},
!showHiddenFiles && { filePath: { hidden: false } }
!showHiddenFiles && { filePath: { hidden: false } },
explorerSettingsSnapshot.layoutMode === 'media' && [
{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }
]
].filter(Boolean) as any,
take
},
Expand Down Expand Up @@ -268,47 +273,32 @@ function useLocationExplorerSettings(location: Location) {
};
}

function useLocationSearch(
explorerSettings: UseExplorerSettings<FilePathOrder>,
location: Location
) {
function useLocationSearch(location: Location) {
const [searchParams, setSearchParams] = useRawSearchParams();
const explorerSettingsSnapshot = explorerSettings.useSettingsSnapshot();

const fixedFilters = useMemo(
() => [
{ filePath: { locations: { in: [location.id] } } },
...(explorerSettingsSnapshot.layoutMode === 'media'
? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
: [])
],
[location.id, explorerSettingsSnapshot.layoutMode]
);

const filtersParam = searchParams.get('filters');
const dynamicFilters = useMemo(() => JSON.parse(filtersParam ?? '[]'), [filtersParam]);
const filters = useMemo(() => JSON.parse(filtersParam ?? '[]'), [filtersParam]);

const searchQueryParam = searchParams.get('search');

const search = useSearch({
open: !!searchQueryParam || dynamicFilters.length > 0 || undefined,
open: !!searchQueryParam || filters.length > 0 || undefined,
search: searchParams.get('search') ?? undefined,
fixedFilters,
dynamicFilters
defaultFilters: [{ filePath: { locations: { in: [location.id] } } }],
filters: filters
});

useEffect(() => {
setSearchParams(
(p) => {
if (search.dynamicFilters.length > 0)
p.set('filters', JSON.stringify(search.dynamicFilters));
if (search.filters.length > 0) p.set('filters', JSON.stringify(search.filters));
else p.delete('filters');

return p;
},
{ replace: true }
);
}, [search.dynamicFilters, setSearchParams]);
}, [search.filters, setSearchParams]);

const searchQuery = search.search;

Expand Down
19 changes: 5 additions & 14 deletions interface/app/$libraryId/recents.tsx
View file
Open in desktop
Expand Up @@ -25,27 +25,18 @@ export function Component() {

const explorerSettingsSnapshot = explorerSettings.useSettingsSnapshot();

const fixedFilters = useMemo<SearchFilterArgs[]>(
() => [
// { object: { dateAccessed: { from: new Date(0).toISOString() } } },
...(explorerSettingsSnapshot.layoutMode === 'media'
? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
: [])
],
[explorerSettingsSnapshot.layoutMode]
);

const search = useSearch({
fixedFilters
});
const search = useSearch();

const objects = useObjectsExplorerQuery({
arg: {
take: 100,
filters: [
...search.allFilters,
// TODO: Add fil ter to search options
{ object: { dateAccessed: { from: new Date(0).toISOString() } } }
{ object: { dateAccessed: { from: new Date(0).toISOString() } } },
...(explorerSettingsSnapshot.layoutMode === 'media'
? [{ object: { kind: { in: [ObjectKindEnum.Image, ObjectKindEnum.Video] } } }]
: [])
]
},
order: explorerSettings.useSettingsSnapshot().order
Expand Down
8 changes: 4 additions & 4 deletions interface/app/$libraryId/saved-search/$id.tsx
View file
Open in desktop
Expand Up @@ -46,14 +46,14 @@ export const Component = () => {

const rawFilters = savedSearch.data?.filters;

const dynamicFilters = useMemo(() => {
const filters = useMemo(() => {
if (rawFilters) return JSON.parse(rawFilters) as SearchFilterArgs[];
}, [rawFilters]);

const search = useSearch({
open: true,
search: savedSearch.data?.search ?? undefined,
dynamicFilters
filters: filters
});

const paths = usePathsExplorerQuery({
Expand Down Expand Up @@ -85,7 +85,7 @@ export const Component = () => {
>
<hr className="w-full border-t border-sidebar-divider bg-sidebar-divider" />
<SearchOptions>
{(search.dynamicFilters !== dynamicFilters ||
{(search.filters !== filters ||
search.search !== savedSearch.data?.search) && (
<SaveButton searchId={id} />
)}
Expand Down Expand Up @@ -123,7 +123,7 @@ function SaveButton({ searchId }: { searchId: number }) {
updateSavedSearch.mutate([
searchId,
{
filters: JSON.stringify(search.dynamicFilters),
filters: JSON.stringify(search.filters),
search: search.search
}
]);
Expand Down
10 changes: 4 additions & 6 deletions interface/app/$libraryId/search/AppliedFilters.tsx
View file
Open in desktop
Expand Up @@ -55,13 +55,11 @@ export const AppliedFilters = ({ allowRemove = true }: { allowRemove?: boolean }
onDelete={
removalIndex !== null && allowRemove
? () => {
search.updateDynamicFilters(
(dyanmicFilters) => {
dyanmicFilters.splice(removalIndex, 1);
search.updateFilters((dyanmicFilters) => {
dyanmicFilters.splice(removalIndex, 1);

return dyanmicFilters;
}
);
return dyanmicFilters;
});
}
: undefined
}
Expand Down
37 changes: 16 additions & 21 deletions interface/app/$libraryId/search/Filters.tsx
View file
Open in desktop
Expand Up @@ -71,28 +71,25 @@ export function useToggleOptionSelected({ search }: { search: UseSearch }) {
option: FilterOption;
select: boolean;
}) => {
search.updateDynamicFilters((dynamicFilters) => {
const key = getKey({ ...option, type: filter.name });
if (search.fixedFiltersKeys?.has(key)) return dynamicFilters;

const rawArg = dynamicFilters.find((arg) => filter.extract(arg));
search.updateFilters((filters) => {
const rawArg = filters.find((arg) => filter.extract(arg));

if (!rawArg) {
const arg = filter.create(option.value);
dynamicFilters.push(arg);
filters.push(arg);
} else {
const rawArgIndex = dynamicFilters.findIndex((arg) => filter.extract(arg))!;
const rawArgIndex = filters.findIndex((arg) => filter.extract(arg))!;

const arg = filter.extract(rawArg)!;

if (select) {
if (rawArg) filter.applyAdd(arg, option);
} else {
if (!filter.applyRemove(arg, option)) dynamicFilters.splice(rawArgIndex, 1);
if (!filter.applyRemove(arg, option)) filters.splice(rawArgIndex, 1);
}
}

return dynamicFilters;
return filters;
});
};
}
Expand Down Expand Up @@ -159,14 +156,14 @@ const FilterOptionText = ({ filter, search }: { filter: SearchFilterCRUD; search
className="flex gap-1.5"
onSubmit={(e) => {
e.preventDefault();
search.updateDynamicFilters((dynamicFilters) => {
if (allFiltersKeys.has(key)) return dynamicFilters;
search.updateFilters((filters) => {
if (allFiltersKeys.has(key)) return filters;

const arg = filter.create(value);
dynamicFilters.push(arg);
filters.push(arg);
setValue('');

return dynamicFilters;
return filters;
});
}}
>
Expand All @@ -191,7 +188,7 @@ const FilterOptionBoolean = ({
filter: SearchFilterCRUD;
search: UseSearch;
}) => {
const { fixedFiltersKeys, allFiltersKeys } = search;
const { allFiltersKeys } = search;

const key = getKey({
type: filter.name,
Expand All @@ -204,19 +201,17 @@ const FilterOptionBoolean = ({
icon={filter.icon}
selected={allFiltersKeys?.has(key)}
setSelected={() => {
search.updateDynamicFilters((dynamicFilters) => {
if (fixedFiltersKeys?.has(key)) return dynamicFilters;

const index = dynamicFilters.findIndex((f) => filter.extract(f) !== undefined);
search.updateFilters((filters) => {
const index = filters.findIndex((f) => filter.extract(f) !== undefined);

if (index !== -1) {
dynamicFilters.splice(index, 1);
filters.splice(index, 1);
} else {
const arg = filter.create(true);
dynamicFilters.push(arg);
filters.push(arg);
}

return dynamicFilters;
return filters;
});
}}
>
Expand Down
6 changes: 5 additions & 1 deletion interface/app/$libraryId/search/SearchBar.tsx
View file
Open in desktop
Expand Up @@ -81,6 +81,7 @@ export default ({ redirectToSearch }: Props) => {

function clearValue() {
search.setSearch('');
search.setFilters([]);
}

return (
Expand All @@ -99,7 +100,10 @@ export default ({ redirectToSearch }: Props) => {
search.setSearchBarFocused(false);
}
}}
onFocus={() => search.setSearchBarFocused(true)}
onFocus={() => {
search.setSearchBarFocused(true);
if (search.defaultFilters) search.setFilters(search.defaultFilters);
}}
right={
<div className="pointer-events-none flex h-7 items-center space-x-1 opacity-70 group-focus-within:hidden">
{
Expand Down
4 changes: 1 addition & 3 deletions interface/app/$libraryId/search/SearchOptions.tsx
View file
Open in desktop
Expand Up @@ -124,9 +124,7 @@ export const SearchOptions = ({

{children ?? (
<>
{(search.dynamicFilters.length > 0 || search.search !== '') && (
<SaveSearchButton />
)}
{(search.filters.length > 0 || search.search !== '') && <SaveSearchButton />}

<EscapeButton />
</>
Expand Down