focus wip

This commit is contained in:
Manav Rathi
2024-10-22 21:17:03 +05:30
parent 997cf72eae
commit 1979da383f
2 changed files with 75 additions and 74 deletions

View File

@@ -315,11 +315,18 @@ export default function Gallery() {
const hiddenCollectionSummaries = state.hiddenCollectionSummaries;
const tempDeletedFileIDs = state.tempDeletedFileIDs;
const tempHiddenFileIDs = state.tempHiddenFileIDs;
const barMode = state.barMode ?? "albums";
const activeCollectionID = state.activeCollectionID;
const activeCollection = state.activeCollection;
const activePersonID = state.activePersonID;
const barMode = state.focus.type ?? "albums";
const activeCollectionID =
state.focus.type == "people"
? undefined
: state.focus.activeCollectionSummaryID;
const activeCollection =
state.focus.type == "people" ? undefined : state.focus.activeCollection;
const activePerson =
state.focus.type == "people" ? state.focus.activePerson : undefined;
const activePersonID = activePerson?.id;
const isInSearchMode = state.isInSearchMode;
const filteredFiles = state.filteredFiles;
if (process.env.NEXT_PUBLIC_ENTE_WIP_CL) console.log("render", { state });
@@ -484,8 +491,8 @@ export default function Gallery() {
!archivedCollectionIDs
) {
dispatch({
type: "set",
filteredData: [],
type: "setFilteredFiles",
filteredFiles: [],
galleryPeopleState: undefined,
});
return;
@@ -510,8 +517,8 @@ export default function Gallery() {
}
dispatch({
type: "set",
filteredData: filteredFiles,
type: "setFilteredFiles",
filteredFiles,
galleryPeopleState,
});
}, [
@@ -529,8 +536,6 @@ export default function Gallery() {
activePersonID,
]);
const { filteredData, ...galleryPeopleState } = state;
const selectAll = (e: KeyboardEvent) => {
// ignore ctrl/cmd + a if the user is typing in a text field
if (
@@ -550,7 +555,7 @@ export default function Gallery() {
exportModalView ||
authenticateUserModalView ||
isPhotoSwipeOpen ||
!filteredData?.length ||
!filteredFiles?.length ||
!user
) {
return;
@@ -561,10 +566,10 @@ export default function Gallery() {
count: 0,
collectionID: activeCollectionID,
context:
barMode == "people" && galleryPeopleState?.activePerson?.id
barMode == "people" && activePersonID
? {
mode: "people" as const,
personID: galleryPeopleState.activePerson.id,
personID: activePersonID,
}
: {
mode: barMode as "albums" | "hidden-albums",
@@ -572,7 +577,7 @@ export default function Gallery() {
},
};
filteredData.forEach((item) => {
filteredFiles.forEach((item) => {
if (item.ownerID === user.id) {
selected.ownCount++;
}
@@ -746,7 +751,7 @@ export default function Gallery() {
startLoading();
try {
setOpenCollectionSelector(false);
const selectedFiles = getSelectedFiles(selected, filteredData);
const selectedFiles = getSelectedFiles(selected, filteredFiles);
const toProcessFiles =
ops === COLLECTION_OPS_TYPE.REMOVE
? selectedFiles
@@ -782,7 +787,7 @@ export default function Gallery() {
// passing files here instead of filteredData for hide ops because we want to move all files copies to hidden collection
const selectedFiles = getSelectedFiles(
selected,
ops === FILE_OPS_TYPE.HIDE ? files : filteredData,
ops === FILE_OPS_TYPE.HIDE ? files : filteredFiles,
);
const toProcessFiles =
ops === FILE_OPS_TYPE.DOWNLOAD
@@ -925,7 +930,7 @@ export default function Gallery() {
[],
);
if (!user || !filteredData) {
if (!user || !filteredFiles) {
// Don't render until we get the logged in user and dispatch "mount".
return <div></div>;
}
@@ -1050,8 +1055,11 @@ export default function Gallery() {
setActiveCollectionID: handleSetActiveCollectionID,
hiddenCollectionSummaries,
showPeopleSectionButton,
people: galleryPeopleState?.people ?? [],
activePerson: galleryPeopleState?.activePerson,
people:
(state.focus.type == "people"
? state.focus.people
: undefined) ?? [],
activePerson,
onSelectPerson: handleSelectPerson,
setCollectionNamerAttributes,
setPhotoListHeader,
@@ -1109,14 +1117,14 @@ export default function Gallery() {
) : !isInSearchMode &&
!isFirstLoad &&
barMode == "people" &&
!galleryPeopleState?.activePerson ? (
!activePerson ? (
<PeopleEmptyState />
) : (
<PhotoFrame
page={PAGES.GALLERY}
mode={barMode}
modePlus={isInSearchMode ? "search" : barMode}
files={filteredData}
files={filteredFiles}
syncWithRemote={syncWithRemote}
favItemIds={state.favoriteFileIDs}
setSelected={setSelected}
@@ -1126,7 +1134,7 @@ export default function Gallery() {
}
setIsPhotoSwipeOpen={setIsPhotoSwipeOpen}
activeCollectionID={activeCollectionID}
activePersonID={galleryPeopleState?.activePerson?.id}
activePersonID={activePerson?.id}
enableDownload={true}
fileToCollectionsMap={fileToCollectionsMap}
collectionNameMap={collectionNameMap}

View File

@@ -44,13 +44,16 @@ import type { FamilyData } from "../../services/user";
/**
* Specifies what the bar at the top of the gallery is displaying currently.
*
* TODO: Deprecated(?). Use GalleryFocus instead. Deprecated if it can be used
* in all cases where the bar mode was in use.
*/
export type GalleryBarMode = "albums" | "hidden-albums" | "people";
/**
* Specifies what the gallery is currently displaying.
*
* TODO: An experiment at consolidating state.
* This can be overridden by a search.
*/
export type GalleryFocus =
| {
@@ -59,7 +62,16 @@ export type GalleryFocus =
* albums.
*/
type: "albums" | "hidden-albums";
activeCollectionID: number;
activeCollectionSummaryID: number;
/**
* If the active collection ID is for a collection and not a
* pseudo-collection, this property will be set to the corresponding
* {@link Collection}.
*
* It is guaranteed that this will be one of the {@link collections}
* (when we are in the "albums" focus) or {@link hiddenCollections}
* (when we are in "hidden-albums" focus).
*/
activeCollection: Collection | undefined;
activeCollectionSummary: CollectionSummary;
}
@@ -195,66 +207,22 @@ export interface GalleryState {
* local state also gets synced in a bit.
*/
tempDeletedFileIDs: Set<number>;
/**
* Variant of {@link tempDeletedFileIDs} for files that have just been
* hidden.
*/
tempHiddenFileIDs: Set<number>;
/*--< Transient UI state >--*/
/*--< State that underlies transient UI state >--*/
/**
* If visible, what should the (sticky) gallery bar show.
*/
barMode: GalleryBarMode | undefined;
/**
* The section / area, and the item within it, that the gallery is currently
* showing.
*/
focus: GalleryFocus | undefined;
activeCollectionID: number | undefined;
/**
* If the active collection ID is for a collection and not a
* pseudo-collection, this property will be set to the corresponding
* {@link Collection}.
*
* It is guaranteed that this will be one of the {@link collections} (when
* we are in the "albums" focus) or {@link hiddenCollections} (when we are
* in "hidden-albums" focus).
*/
activeCollection: Collection | undefined;
/**
* The currently selected person, if any.
*
* When present, it is used to derive the {@link activePerson} property of
* the {@link focus}.
* the {@link focus}. UI code should use the focus, this is meant as the
* underlying primitive state.
*/
activePersonID: string | undefined;
filteredData: EnteFile[];
/**
* The currently selected person, if any.
*
* Whenever this is present, it is guaranteed to be one of the items from
* within {@link people}.
*/
activePerson: Person | undefined;
/**
* The list of people to show.
*/
people: Person[] | undefined;
/**
* `true` if we are in "search mode".
*
* We will always be in search mode if we are showing search results, but we
* also may be in search mode earlier on smaller screens, where the search
* input is only shown on entering search mode. See: [Note: "Search mode"].
*
* That is, {@link isInSearchMode} may be true even when
* {@link searchResults} is undefined.
*/
isInSearchMode: boolean;
selectedPersonID: string | undefined;
/**
* List of files that match the selected search option.
*
@@ -266,6 +234,31 @@ export interface GalleryState {
* set this value to the result.
*/
searchResults: EnteFile[] | undefined;
/*--< Transient UI state >--*/
/**
* The section, and the item within it, that the gallery is currently
* showing.
*
* This can be temporarily overridden when we display search results.
*/
focus: GalleryFocus | undefined;
/**
* The files to show, uniqued and sorted appropriately.
*/
filteredFiles: EnteFile[] | undefined;
/**
* `true` if we are in "search mode".
*
* We will always be in search mode if we are showing search results, but we
* also may be in search mode earlier on smaller screens, where the search
* input is only shown on entering search mode. See: [Note: "Search mode"].
*
* That is, {@link isInSearchMode} may be true even when
* {@link searchResults} is undefined.
*/
isInSearchMode: boolean;
}
export type GalleryAction =
@@ -279,8 +272,8 @@ export type GalleryAction =
trashedFiles: EnteFile[];
}
| {
type: "set";
filteredData: EnteFile[];
type: "setFilteredFiles";
filteredFiles: EnteFile[];
galleryPeopleState:
| { activePerson: Person | undefined; people: Person[] }
| undefined;