feat(ui): use imageDTOs instead of images in starring queries

This commit is contained in:
psychedelicious 2023-08-16 11:45:21 +10:00
parent 8b1ec2685f
commit 230131646f
4 changed files with 22 additions and 16 deletions

View File

@ -30,11 +30,11 @@ const MultipleSelectionMenuItems = () => {
}, [dispatch, selection]); }, [dispatch, selection]);
const handleStarSelection = useCallback(() => { const handleStarSelection = useCallback(() => {
starImages({ images: selection }); starImages({ imageDTOs: selection });
}, [starImages, selection]); }, [starImages, selection]);
const handleUnstarSelection = useCallback(() => { const handleUnstarSelection = useCallback(() => {
unstarImages({ images: selection }); unstarImages({ imageDTOs: selection });
}, [unstarImages, selection]); }, [unstarImages, selection]);
const areAllStarred = useMemo(() => { const areAllStarred = useMemo(() => {

View File

@ -136,11 +136,11 @@ const SingleSelectionMenuItems = (props: SingleSelectionMenuItemsProps) => {
}, [copyImageToClipboard, imageDTO.image_url]); }, [copyImageToClipboard, imageDTO.image_url]);
const handleStarImage = useCallback(() => { const handleStarImage = useCallback(() => {
if (imageDTO) starImages({ images: [imageDTO] }); if (imageDTO) starImages({ imageDTOs: [imageDTO] });
}, [starImages, imageDTO]); }, [starImages, imageDTO]);
const handleUnstarImage = useCallback(() => { const handleUnstarImage = useCallback(() => {
if (imageDTO) unstarImages({ images: [imageDTO] }); if (imageDTO) unstarImages({ imageDTOs: [imageDTO] });
}, [unstarImages, imageDTO]); }, [unstarImages, imageDTO]);
return ( return (

View File

@ -71,10 +71,10 @@ const GalleryImage = (props: HoverableImageProps) => {
const toggleStarredState = useCallback(() => { const toggleStarredState = useCallback(() => {
if (imageDTO) { if (imageDTO) {
if (imageDTO.starred) { if (imageDTO.starred) {
unstarImages({ images: [imageDTO] }); unstarImages({ imageDTOs: [imageDTO] });
} }
if (!imageDTO.starred) { if (!imageDTO.starred) {
starImages({ images: [imageDTO] }); starImages({ imageDTOs: [imageDTO] });
} }
} }
}, [starImages, unstarImages, imageDTO]); }, [starImages, unstarImages, imageDTO]);

View File

@ -392,14 +392,14 @@ export const imagesApi = api.injectEndpoints({
*/ */
starImages: build.mutation< starImages: build.mutation<
paths['/api/v1/images/unstar']['post']['responses']['200']['content']['application/json'], paths['/api/v1/images/unstar']['post']['responses']['200']['content']['application/json'],
{ images: ImageDTO[] } { imageDTOs: ImageDTO[] }
>({ >({
query: ({ images }) => ({ query: ({ imageDTOs: images }) => ({
url: `images/star`, url: `images/star`,
method: 'POST', method: 'POST',
body: { image_names: images.map((img) => img.image_name) }, body: { image_names: images.map((img) => img.image_name) },
}), }),
invalidatesTags: (result, error, { images }) => { invalidatesTags: (result, error, { imageDTOs: images }) => {
// assume all images are on the same board/category // assume all images are on the same board/category
if (images[0]) { if (images[0]) {
const categories = getCategories(images[0]); const categories = getCategories(images[0]);
@ -416,7 +416,10 @@ export const imagesApi = api.injectEndpoints({
} }
return []; return [];
}, },
async onQueryStarted({ images }, { dispatch, queryFulfilled, getState }) { async onQueryStarted(
{ imageDTOs },
{ dispatch, queryFulfilled, getState }
) {
try { try {
/** /**
* Cache changes for pinImages: * Cache changes for pinImages:
@ -425,7 +428,7 @@ export const imagesApi = api.injectEndpoints({
*/ */
const { data } = await queryFulfilled; const { data } = await queryFulfilled;
const updatedImages = images.filter((i) => const updatedImages = imageDTOs.filter((i) =>
data.updated_image_names.includes(i.image_name) data.updated_image_names.includes(i.image_name)
); );
@ -501,14 +504,14 @@ export const imagesApi = api.injectEndpoints({
*/ */
unstarImages: build.mutation< unstarImages: build.mutation<
paths['/api/v1/images/unstar']['post']['responses']['200']['content']['application/json'], paths['/api/v1/images/unstar']['post']['responses']['200']['content']['application/json'],
{ images: ImageDTO[] } { imageDTOs: ImageDTO[] }
>({ >({
query: ({ images }) => ({ query: ({ imageDTOs: images }) => ({
url: `images/unstar`, url: `images/unstar`,
method: 'POST', method: 'POST',
body: { image_names: images.map((img) => img.image_name) }, body: { image_names: images.map((img) => img.image_name) },
}), }),
invalidatesTags: (result, error, { images }) => { invalidatesTags: (result, error, { imageDTOs: images }) => {
// assume all images are on the same board/category // assume all images are on the same board/category
if (images[0]) { if (images[0]) {
const categories = getCategories(images[0]); const categories = getCategories(images[0]);
@ -525,7 +528,10 @@ export const imagesApi = api.injectEndpoints({
} }
return []; return [];
}, },
async onQueryStarted({ images }, { dispatch, queryFulfilled, getState }) { async onQueryStarted(
{ imageDTOs },
{ dispatch, queryFulfilled, getState }
) {
try { try {
/** /**
* Cache changes for unstarImages: * Cache changes for unstarImages:
@ -534,7 +540,7 @@ export const imagesApi = api.injectEndpoints({
*/ */
const { data } = await queryFulfilled; const { data } = await queryFulfilled;
const updatedImages = images.filter((i) => const updatedImages = imageDTOs.filter((i) =>
data.updated_image_names.includes(i.image_name) data.updated_image_names.includes(i.image_name)
); );