Fix change of container id after update

This commit is contained in:
Anders Roos 2022-11-15 22:48:09 +01:00
parent adb97f7ed0
commit ee9475bcda
2 changed files with 30 additions and 18 deletions

View file

@ -8,7 +8,7 @@ interface ContainerListProps {
const ContainerList = (props: ContainerListProps) => ( const ContainerList = (props: ContainerListProps) => (
<ul className="list-group"> <ul className="list-group">
{props.containers.map((c) => <ContainerListEntry {...c} onClick={() => props.onContainerClick(c)} />)} {props.containers.map((c) => <ContainerListEntry {...c} key={c.ContainerID} onClick={() => props.onContainerClick(c)} />)}
</ul > </ul >
); );

View file

@ -1,6 +1,6 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import ContainerModel from "../models/ContainerModel"; import ContainerModel from "../models/ContainerModel";
import { check, list, update } from "../services/Api"; import { check, list, ListResponse, update } from "../services/Api";
import ContainerList from "./ContainerList"; import ContainerList from "./ContainerList";
import Spinner from "./Spinner"; import Spinner from "./Spinner";
import SpinnerModal from "./SpinnerModal"; import SpinnerModal from "./SpinnerModal";
@ -23,7 +23,12 @@ const ContainerView = () => {
const hasSelectedContainers = containers.some((c) => c.Selected); const hasSelectedContainers = containers.some((c) => c.Selected);
const hasUpdates = containersWithUpdates.length > 0; const hasUpdates = containersWithUpdates.length > 0;
const checkForUpdates = async () => { const checkForUpdates = async (containersToUpdate?: ContainerModel[]) => {
if (!containersToUpdate) {
containersToUpdate = containers;
}
setChecking(true); setChecking(true);
setViewModel((m) => ({ setViewModel((m) => ({
@ -34,7 +39,7 @@ const ContainerView = () => {
})) }))
})); }));
await Promise.all(containers.map(async (c1) => { await Promise.all(containersToUpdate.map(async (c1) => {
const result = await check(c1.ContainerID); const result = await check(c1.ContainerID);
setViewModel((m) => ({ setViewModel((m) => ({
...m, ...m,
@ -51,10 +56,7 @@ const ContainerView = () => {
setHasChecked(true); setHasChecked(true);
}; };
const listContainers = async () => { const mapListDataToViewModel = (data: ListResponse) => ({
setLoading(true);
const data = await list();
setViewModel({
Containers: data.Containers.map((c) => ({ Containers: data.Containers.map((c) => ({
...c, ...c,
Selected: false, Selected: false,
@ -65,15 +67,25 @@ const ContainerView = () => {
NewVersionCreated: "" NewVersionCreated: ""
})) }))
}); });
const listContainers = async () => {
setLoading(true);
const data = await list();
const mappedViewModel = mapListDataToViewModel(data);
setViewModel((m) => ({
...m,
...mappedViewModel
}));
setLoading(false); setLoading(false);
setHasChecked(false); setHasChecked(false);
return mappedViewModel;
}; };
const updateImages = async (imagesToUpdate?: string[]) => { const updateImages = async (imagesToUpdate?: string[]) => {
setUpdating(true); setUpdating(true);
await update(imagesToUpdate); await update(imagesToUpdate);
await listContainers(); const data = await listContainers();
await checkForUpdates(); await checkForUpdates(data.Containers);
setUpdating(false); setUpdating(false);
}; };
@ -117,7 +129,7 @@ const ContainerView = () => {
<div className="col-12 col-md-8 text-end"> <div className="col-12 col-md-8 text-end">
{hasUpdates && <UpdateSelected onClick={updateSelected} disabled={checking || !hasSelectedContainers} />} {hasUpdates && <UpdateSelected onClick={updateSelected} disabled={checking || !hasSelectedContainers} />}
{hasUpdates && <UpdateAll onClick={updateAll} disabled={checking} />} {hasUpdates && <UpdateAll onClick={updateAll} disabled={checking} />}
<UpdateCheck onClick={checkForUpdates} disabled={checking} /> <UpdateCheck onClick={() => checkForUpdates()} disabled={checking} />
</div> </div>
</div> </div>