diff --git a/client/src/components/windows/AlbumWindow.tsx b/client/src/components/windows/AlbumWindow.tsx index e7cdb1c..6cefcb8 100644 --- a/client/src/components/windows/AlbumWindow.tsx +++ b/client/src/components/windows/AlbumWindow.tsx @@ -7,6 +7,7 @@ import StoreLinkIcon, { whichStore } from '../common/StoreLinkIcon'; import EditableText from '../common/EditableText'; import SubmitChangesButton from '../common/SubmitChangesButton'; import SongTable, { SongGetters } from '../tables/ResultsTable'; +import { saveAlbumChanges } from '../../lib/saveChanges'; var _ = require('lodash'); export type AlbumMetadata = serverApi.AlbumDetails; @@ -24,6 +25,7 @@ export enum AlbumWindowStateActions { SetMetadata = "SetMetadata", SetPendingChanges = "SetPendingChanges", SetSongs = "SetSongs", + Reload = "Reload", } export function AlbumWindowReducer(state: AlbumWindowState, action: any) { @@ -34,6 +36,8 @@ export function AlbumWindowReducer(state: AlbumWindowState, action: any) { return { ...state, pendingChanges: action.value } case AlbumWindowStateActions.SetSongs: return { ...state, songsOnAlbum: action.value } + case AlbumWindowStateActions.Reload: + return { ...state, metadata: null, pendingChanges: null, songsOnAlbum: null } default: throw new Error("Unimplemented AlbumWindow state update.") } @@ -97,7 +101,7 @@ export default function AlbumWindow(props: IProps) { // Effect to get the album's songs. useEffect(() => { - if(props.state.songsOnAlbum) { return; } + if (props.state.songsOnAlbum) { return; } var q: serverApi.QueryRequest = { query: { @@ -164,8 +168,21 @@ export default function AlbumWindow(props: IProps) { }); + const [applying, setApplying] = useState(false); const maybeSubmitButton = pendingChanges && Object.keys(pendingChanges).length > 0 && - + + { + setApplying(true); + saveAlbumChanges(props.state.albumId, pendingChanges || {}) + .then(() => { + setApplying(false); + props.dispatch({ + type: AlbumWindowStateActions.Reload + }) + }) + }} /> + {applying && } + return { - if(props.state.songsByArtist) { return; } + if (props.state.songsByArtist) { return; } var q: serverApi.QueryRequest = { query: { @@ -164,8 +168,21 @@ export default function ArtistWindow(props: IProps) { }); + const [applying, setApplying] = useState(false); const maybeSubmitButton = pendingChanges && Object.keys(pendingChanges).length > 0 && - + + { + setApplying(true); + saveArtistChanges(props.state.artistId, pendingChanges || {}) + .then(() => { + setApplying(false); + props.dispatch({ + type: ArtistWindowStateActions.Reload + }) + }) + }} /> + {applying && } + return }); + const [applying, setApplying] = useState(false); const maybeSubmitButton = pendingChanges && Object.keys(pendingChanges).length > 0 && - + + { + setApplying(true); + saveTagChanges(props.state.tagId, pendingChanges || {}) + .then(() => { + setApplying(false); + props.dispatch({ + type: TagWindowStateActions.Reload + }) + }) + }} /> + {applying && } + return