mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
fix(ui): attempt to fix fetch images
- Change the name of the redux action from `imagesUpdatedOne` to `imageUrlsUpdated` which is much clearer - Add handling for initial image and canvas staging images (I had missed this initially)
This commit is contained in:
parent
452afa0935
commit
f9404b2f49
invokeai/frontend/web/src
app/store/middleware/listenerMiddleware/listeners
features
canvas/store
gallery/store
parameters/store
@ -1,7 +1,7 @@
|
|||||||
import { log } from 'app/logging/useLogger';
|
import { log } from 'app/logging/useLogger';
|
||||||
import { startAppListening } from '..';
|
import { startAppListening } from '..';
|
||||||
import { imageUrlsReceived } from 'services/thunks/image';
|
import { imageUrlsReceived } from 'services/thunks/image';
|
||||||
import { imageUpdatedOne } from 'features/gallery/store/imagesSlice';
|
import { imageUrlsUpdated } from 'features/gallery/store/imagesSlice';
|
||||||
|
|
||||||
const moduleLog = log.child({ namespace: 'image' });
|
const moduleLog = log.child({ namespace: 'image' });
|
||||||
|
|
||||||
@ -11,7 +11,7 @@ export const addImageUrlsReceivedFulfilledListener = () => {
|
|||||||
effect: (action, { getState, dispatch }) => {
|
effect: (action, { getState, dispatch }) => {
|
||||||
const image = action.payload;
|
const image = action.payload;
|
||||||
moduleLog.debug({ data: { image } }, 'Image URLs received');
|
moduleLog.debug({ data: { image } }, 'Image URLs received');
|
||||||
dispatch(imageUpdatedOne(image));
|
dispatch(imageUrlsUpdated(image));
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -30,7 +30,7 @@ import {
|
|||||||
} from './canvasTypes';
|
} from './canvasTypes';
|
||||||
import { ImageDTO } from 'services/api';
|
import { ImageDTO } from 'services/api';
|
||||||
import { sessionCanceled } from 'services/thunks/session';
|
import { sessionCanceled } from 'services/thunks/session';
|
||||||
import { imageUpdatedOne } from 'features/gallery/store/imagesSlice';
|
import { imageUrlsUpdated } from 'features/gallery/store/imagesSlice';
|
||||||
|
|
||||||
export const initialLayerState: CanvasLayerState = {
|
export const initialLayerState: CanvasLayerState = {
|
||||||
objects: [],
|
objects: [],
|
||||||
@ -853,7 +853,7 @@ export const canvasSlice = createSlice({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
builder.addCase(imageUpdatedOne, (state, action) => {
|
builder.addCase(imageUrlsUpdated, (state, action) => {
|
||||||
const { image_name, image_origin, image_url, thumbnail_url } =
|
const { image_name, image_origin, image_url, thumbnail_url } =
|
||||||
action.payload;
|
action.payload;
|
||||||
|
|
||||||
@ -865,6 +865,13 @@ export const canvasSlice = createSlice({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
state.layerState.stagingArea.images.forEach((stagedImage) => {
|
||||||
|
if (stagedImage.image.image_name === image_name) {
|
||||||
|
stagedImage.image.image_url = image_url;
|
||||||
|
stagedImage.image.thumbnail_url = thumbnail_url;
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import type { PayloadAction } from '@reduxjs/toolkit';
|
import type { PayloadAction } from '@reduxjs/toolkit';
|
||||||
import { createSlice } from '@reduxjs/toolkit';
|
import { createSlice } from '@reduxjs/toolkit';
|
||||||
import { ImageDTO } from 'services/api';
|
import { ImageDTO } from 'services/api';
|
||||||
import { imageUpdatedOne, imageUpserted } from './imagesSlice';
|
import { imageUrlsUpdated, imageUpserted } from './imagesSlice';
|
||||||
|
|
||||||
type GalleryImageObjectFitType = 'contain' | 'cover';
|
type GalleryImageObjectFitType = 'contain' | 'cover';
|
||||||
|
|
||||||
@ -54,7 +54,7 @@ export const gallerySlice = createSlice({
|
|||||||
state.selectedImage = action.payload;
|
state.selectedImage = action.payload;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
builder.addCase(imageUpdatedOne, (state, action) => {
|
builder.addCase(imageUrlsUpdated, (state, action) => {
|
||||||
const { image_name, image_origin, image_url, thumbnail_url } =
|
const { image_name, image_origin, image_url, thumbnail_url } =
|
||||||
action.payload;
|
action.payload;
|
||||||
|
|
||||||
|
@ -57,7 +57,7 @@ const imagesSlice = createSlice({
|
|||||||
|
|
||||||
imagesAdapter.removeOne(state, action.payload.image_name);
|
imagesAdapter.removeOne(state, action.payload.image_name);
|
||||||
},
|
},
|
||||||
imageUpdatedOne: (state, action: PayloadAction<ImageUrlsDTO>) => {
|
imageUrlsUpdated: (state, action: PayloadAction<ImageUrlsDTO>) => {
|
||||||
imagesAdapter.updateOne(state, {
|
imagesAdapter.updateOne(state, {
|
||||||
id: action.payload.image_name,
|
id: action.payload.image_name,
|
||||||
changes: action.payload,
|
changes: action.payload,
|
||||||
@ -95,7 +95,7 @@ export const {
|
|||||||
|
|
||||||
export const {
|
export const {
|
||||||
imageUpserted,
|
imageUpserted,
|
||||||
imageUpdatedOne,
|
imageUrlsUpdated,
|
||||||
imageRemoved,
|
imageRemoved,
|
||||||
imageCategoriesChanged,
|
imageCategoriesChanged,
|
||||||
} = imagesSlice.actions;
|
} = imagesSlice.actions;
|
||||||
|
@ -8,6 +8,7 @@ import { receivedModels } from 'services/thunks/model';
|
|||||||
import { Scheduler } from 'app/constants';
|
import { Scheduler } from 'app/constants';
|
||||||
import { ImageDTO } from 'services/api';
|
import { ImageDTO } from 'services/api';
|
||||||
import { configChanged } from 'features/system/store/configSlice';
|
import { configChanged } from 'features/system/store/configSlice';
|
||||||
|
import { imageUrlsUpdated } from 'features/gallery/store/imagesSlice';
|
||||||
|
|
||||||
export interface GenerationState {
|
export interface GenerationState {
|
||||||
cfgScale: number;
|
cfgScale: number;
|
||||||
@ -239,6 +240,15 @@ export const generationSlice = createSlice({
|
|||||||
state.model = defaultModel;
|
state.model = defaultModel;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
builder.addCase(imageUrlsUpdated, (state, action) => {
|
||||||
|
const { image_name, image_origin, image_url, thumbnail_url } =
|
||||||
|
action.payload;
|
||||||
|
|
||||||
|
if (state.initialImage && state.initialImage.image_name === image_name) {
|
||||||
|
state.initialImage.image_url = image_url;
|
||||||
|
state.initialImage.thumbnail_url = thumbnail_url;
|
||||||
|
}
|
||||||
|
});
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user