fix(ui): separate thunk for initial gallery load so it properly gets index 0

This commit is contained in:
Mary Hipp 2023-04-03 12:54:10 -04:00
parent 69c71c83e6
commit 3722f055fb
4 changed files with 31 additions and 19 deletions

View File

@ -34,7 +34,7 @@ import {
} from 'services/apiSlice'; } from 'services/apiSlice';
import { emitUnsubscribe } from './actions'; import { emitUnsubscribe } from './actions';
import { resultAdded } from 'features/gallery/store/resultsSlice'; import { resultAdded } from 'features/gallery/store/resultsSlice';
import { getNextResultsPage } from 'services/thunks/extra'; import { getInitialResultsPage } from 'services/thunks/gallery';
import { prepareResultImage } from 'services/util/prepareResultImage'; import { prepareResultImage } from 'services/util/prepareResultImage';
/** /**
@ -57,7 +57,7 @@ const makeSocketIOListeners = (
// fetch more results, but only if we don't already have results // fetch more results, but only if we don't already have results
// maybe we should have a different thunk for `onConnect` vs when you click 'Load More'? // maybe we should have a different thunk for `onConnect` vs when you click 'Load More'?
if (!getState().results.ids.length) { if (!getState().results.ids.length) {
dispatch(getNextResultsPage()); dispatch(getInitialResultsPage());
} }
} catch (e) { } catch (e) {
console.error(e); console.error(e);
@ -98,21 +98,21 @@ const makeSocketIOListeners = (
dispatch(resultAdded(resultImage)); dispatch(resultAdded(resultImage));
// // need to update the type for this or figure out how to get these values // // need to update the type for this or figure out how to get these values
// dispatch( dispatch(
// addImage({ addImage({
// category: 'result', category: 'result',
// image: { image: {
// uuid: uuidv4(), uuid: uuidv4(),
// url: imageUrl, url: resultImage.url,
// thumbnail: '', thumbnail: '',
// width: 512, width: 512,
// height: 512, height: 512,
// category: 'result', category: 'result',
// name: imageName, name: resultImage.name,
// mtime: new Date().getTime(), mtime: new Date().getTime(),
// }, },
// }) })
// ); );
dispatch( dispatch(
addLogEntry({ addLogEntry({

View File

@ -26,7 +26,7 @@ import HoverableImage from './HoverableImage';
import Scrollable from 'features/ui/components/common/Scrollable'; import Scrollable from 'features/ui/components/common/Scrollable';
import { requestCanvasRescale } from 'features/canvas/store/thunks/requestCanvasScale'; import { requestCanvasRescale } from 'features/canvas/store/thunks/requestCanvasScale';
import { selectResultsAll, selectResultsTotal } from '../store/resultsSlice'; import { selectResultsAll, selectResultsTotal } from '../store/resultsSlice';
import { getNextResultsPage } from 'services/thunks/extra'; import { getNextResultsPage } from 'services/thunks/gallery';
const GALLERY_SHOW_BUTTONS_MIN_WIDTH = 290; const GALLERY_SHOW_BUTTONS_MIN_WIDTH = 290;

View File

@ -3,7 +3,7 @@ import { ResultImage } from 'app/invokeai';
import { RootState } from 'app/store'; import { RootState } from 'app/store';
import { map } from 'lodash'; import { map } from 'lodash';
import { getNextResultsPage } from 'services/thunks/extra'; import { getNextResultsPage } from 'services/thunks/gallery';
import { isImageOutput } from 'services/types/guards'; import { isImageOutput } from 'services/types/guards';
import { prepareResultImage } from 'services/util/prepareResultImage'; import { prepareResultImage } from 'services/util/prepareResultImage';

View File

@ -29,3 +29,15 @@ export const getNextResultsPage = createAppAsyncThunk(
return response; return response;
} }
); );
export const getInitialResultsPage = createAppAsyncThunk(
'results/getMoreResultsImages',
async (_arg) => {
const response = await SessionsService.listSessions({
page: 0,
perPage: 10,
});
return response;
}
);