[DEV] remove all async it is too slow...

This commit is contained in:
Edouard DUPIN 2024-08-29 20:09:59 +02:00
parent d49e1d06fe
commit 244f8a988e
10 changed files with 255 additions and 379 deletions

View File

@ -4,153 +4,169 @@
* @license PROPRIETARY (see license file) * @license PROPRIETARY (see license file)
*/ */
import { Injectable } from '@angular/core'; import { Injectable } from "@angular/core";
import { Album, AlbumResource, UUID } from 'app/back-api'; import { Album, AlbumResource, UUID } from "app/back-api";
import { RESTConfig } from 'app/back-api/rest-tools'; import { RESTConfig } from "app/back-api/rest-tools";
import { environment } from 'environments/environment'; import { environment } from "environments/environment";
import { GenericDataService } from './GenericDataService'; import { GenericDataService } from "./GenericDataService";
import { DataTools, DataStore, SessionService, TypeCheck, isNumber, isArrayOf } from '@kangaroo-and-rabbit/kar-cw'; import {
DataTools,
DataStore,
SessionService,
TypeCheck,
isNumber,
isArrayOf,
} from "@kangaroo-and-rabbit/kar-cw";
@Injectable() @Injectable()
export class AlbumService extends GenericDataService<Album> { export class AlbumService extends GenericDataService<Album> {
getRestConfig(): RESTConfig {
return {
server: environment.server.karusic,
token: this.session.getToken(),
};
}
private lambdaGets(): Promise<Album[]> {
const self = this;
return AlbumResource.gets({ restConfig: this.getRestConfig() });
}
getRestConfig(): RESTConfig { constructor(private session: SessionService) {
return { super();
server: environment.server.karusic, console.log("Start AlbumService");
token: this.session.getToken() this.setStore(new DataStore<Album>(() => this.lambdaGets()));
} }
}
private lambdaGets(): Promise<Album[]> {
const self = this;
return AlbumResource.gets({ restConfig: this.getRestConfig() });
}
constructor(private session: SessionService) { insert(data: Album): Promise<Album> {
super(); const self = this;
console.log('Start AlbumService'); return new Promise((resolve, reject) => {
this.setStore(new DataStore<Album>(() => this.lambdaGets())); AlbumResource.post({
} restConfig: this.getRestConfig(),
data,
})
.then((value: Album) => {
self.dataStore.updateValue(value);
resolve(value);
})
.catch((error) => {
reject(error);
});
});
}
patch(id: number, data: Album): Promise<Album> {
const self = this;
return new Promise((resolve, reject) => {
AlbumResource.patch({
restConfig: this.getRestConfig(),
params: {
id,
},
data,
})
.then((value: Album) => {
self.dataStore.updateValue(value);
resolve(value);
})
.catch((error) => {
reject(error);
});
});
}
insert(data: Album): Promise<Album> { delete(id: number): Promise<void> {
const self = this; const self = this;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
AlbumResource.post({ AlbumResource.remove({
restConfig: this.getRestConfig(), restConfig: this.getRestConfig(),
data params: {
}).then((value: Album) => { id,
self.dataStore.updateValue(value); },
resolve(value); })
}).catch((error) => { .then(() => {
reject(error); self.dataStore.delete(id);
}); resolve();
}); })
} .catch((error) => {
patch(id: number, data: Album): Promise<Album> { reject(error);
const self = this; });
return new Promise((resolve, reject) => { });
AlbumResource.patch({ }
restConfig: this.getRestConfig(),
params: {
id
},
data
}).then((value: Album) => {
self.dataStore.updateValue(value);
resolve(value);
}).catch((error) => {
reject(error);
});
});
}
delete(id: number): Promise<void> { deleteCover(id: number, coverId: UUID): Promise<Album> {
const self = this; let self = this;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
AlbumResource.remove({ AlbumResource.removeCover({
restConfig: this.getRestConfig(), restConfig: this.getRestConfig(),
params: { params: {
id id,
} coverId,
}).then(() => { },
self.dataStore.delete(id); })
resolve(); .then((value) => {
}).catch((error) => { self.dataStore.updateValue(value);
reject(error); resolve(value);
}); })
}); .catch((error) => {
} reject(error);
});
deleteCover(id: number, coverId: UUID): Promise<Album> { });
let self = this; }
return new Promise((resolve, reject) => { uploadCover(id: number, file: File, progress: any = null): Promise<Album> {
AlbumResource.removeCover({ let self = this;
restConfig: this.getRestConfig(), return new Promise((resolve, reject) => {
params: { AlbumResource.uploadCover({
id, restConfig: this.getRestConfig(),
coverId params: {
} id,
}).then((value) => { },
self.dataStore.updateValue(value); data: {
resolve(value); file,
}).catch((error) => { },
reject(error); })
}); .then((value) => {
}); self.dataStore.updateValue(value);
} resolve(value);
uploadCover(id: number, })
file: File, .catch((error) => {
progress: any = null): Promise<Album> { reject(error);
let self = this; });
return new Promise((resolve, reject) => { });
AlbumResource.uploadCover({ }
restConfig: this.getRestConfig(),
params: {
id,
},
data: {
file,
}
}).then((value) => {
self.dataStore.updateValue(value);
resolve(value);
}).catch((error) => {
reject(error);
});
});
}
/**
* Get all the artists for a specific album
* @param idAlbum - Id of the album.
* @returns a promise on the list of Artist ID for this album
*/
getArtists(idAlbum: number): Promise<number[]> {
let self = this;
return new Promise((resolve, reject) => {
self.gets()
.then((response: Album[]) => {
let data = DataTools.getsWhere(response,
[
{
check: TypeCheck.EQUAL,
key: 'albumId',
value: idAlbum,
},
],
['name']);
// filter with artist- ID !!!
const listArtistId = DataTools.extractLimitOneList(data, "artists");
if (isArrayOf(listArtistId, isNumber)) {
resolve(listArtistId);
} else {
reject(`Fail to get the ids (impossible case) ${listArtistId}`);
}
}).catch((response) => {
reject(response);
});
});
}
/**
* Get all the artists for a specific album
* @param idAlbum - Id of the album.
* @returns a promise on the list of Artist ID for this album
*/
getArtists(idAlbum: number): Promise<number[]> {
let self = this;
return new Promise((resolve, reject) => {
self
.gets()
.then((response: Album[]) => {
let data = DataTools.getsWhere(
response,
[
{
check: TypeCheck.EQUAL,
key: "albumId",
value: idAlbum,
},
],
["name"]
);
// filter with artist- ID !!!
const listArtistId = DataTools.extractLimitOneList(data, "artists");
if (isArrayOf(listArtistId, isNumber)) {
resolve(listArtistId);
} else {
reject(`Fail to get the ids (impossible case) ${listArtistId}`);
}
})
.catch((response) => {
reject(response);
});
});
}
} }

View File

@ -261,6 +261,7 @@ export const AudioPlayer = ({}: AudioPlayerProps) => {
max={duration} max={duration}
step={0.1} step={0.1}
onChange={onSeek} onChange={onSeek}
focusThumbOnChange={false}
> >
<SliderTrack bg="gray.200" height="10px" borderRadius="full"> <SliderTrack bg="gray.200" height="10px" borderRadius="full">
<SliderFilledTrack bg="brand.600" /> <SliderFilledTrack bg="brand.600" />

View File

@ -24,7 +24,7 @@ const helpList: HelpListType[] = [
}, },
]; ];
export const HelpPage = async () => { export const HelpPage = () => {
const { mode } = useThemeMode(); const { mode } = useThemeMode();
const navigate = useNavigate(); const navigate = useNavigate();
const onSelectItem = (data: HelpListType) => { const onSelectItem = (data: HelpListType) => {
@ -35,7 +35,7 @@ export const HelpPage = async () => {
name: 'lkjlkj', name: 'lkjlkj',
}, },
]; ];
const result = await DataTools.getsWhere( const result = DataTools.getsWhere(
testData, testData,
[ [
{ {

View File

@ -37,12 +37,12 @@ export const useAlbumServiceWrapped = (
export const useOrderedAlbums = (titleFilter: string | undefined) => { export const useOrderedAlbums = (titleFilter: string | undefined) => {
const { store } = useAlbumService(); const { store } = useAlbumService();
const dataAlbums = useMemo(async () => { const dataAlbums = useMemo(() => {
let tmpData = store.data; let tmpData = store.data;
if (!isNullOrUndefined(titleFilter)) { if (!isNullOrUndefined(titleFilter)) {
tmpData = DataTools.getNameLike(tmpData, titleFilter); tmpData = DataTools.getNameLike(tmpData, titleFilter);
} }
return await DataTools.getsWhere( return DataTools.getsWhere(
tmpData, tmpData,
[ [
{ {

View File

@ -37,12 +37,12 @@ export const useArtistServiceWrapped = (
export const useOrderedArtists = (nameFilter: string | undefined) => { export const useOrderedArtists = (nameFilter: string | undefined) => {
const { store } = useArtistService(); const { store } = useArtistService();
const dataArtist = useMemo(async () => { const dataArtist = useMemo(() => {
let tmpData = store.data; let tmpData = store.data;
if (!isNullOrUndefined(nameFilter)) { if (!isNullOrUndefined(nameFilter)) {
tmpData = DataTools.getNameLike(tmpData, nameFilter); tmpData = DataTools.getNameLike(tmpData, nameFilter);
} }
return await DataTools.getsWhere( return DataTools.getsWhere(
tmpData, tmpData,
[ [
{ {

View File

@ -37,12 +37,12 @@ export const useGenderServiceWrapped = (
export const useOrderedGenders = (titleFilter: string | undefined) => { export const useOrderedGenders = (titleFilter: string | undefined) => {
const { store } = useGenderService(); const { store } = useGenderService();
const dataGenders = useMemo(async () => { const dataGenders = useMemo(() => {
let tmpData = store.data; let tmpData = store.data;
if (!isNullOrUndefined(titleFilter)) { if (!isNullOrUndefined(titleFilter)) {
tmpData = DataTools.getNameLike(tmpData, titleFilter); tmpData = DataTools.getNameLike(tmpData, titleFilter);
} }
return await DataTools.getsWhere( return DataTools.getsWhere(
tmpData, tmpData,
[ [
{ {

View File

@ -1,101 +0,0 @@
import { useDataStore } from '@/utils/data-store';
import { DataTools, TypeCheck } from '@/utils/data-tools';
import { isNullOrUndefined } from '@/utils/validator';
export class GenericDataService<TYPE> {
constructor(protected dataStore: DataStore<TYPE>) {}
gets(): Promise<TYPE[]> {
return this.dataStore.getData();
}
get(id: number): Promise<TYPE> {
let self = this;
return new Promise((resolve, reject) => {
self
.gets()
.then((response: TYPE[]) => {
let data = DataTools.get(response, id);
if (isNullOrUndefined(data)) {
reject('Data does not exist in the local BDD');
return;
}
resolve(data);
return;
})
.catch((response) => {
reject(response);
});
});
}
getAll(ids: number[]): Promise<TYPE[]> {
let self = this;
return new Promise((resolve, reject) => {
self
.gets()
.then(async (response: TYPE[]) => {
let data = await DataTools.getsWhere(response, [
{
check: TypeCheck.EQUAL,
key: 'id',
value: ids,
},
]);
resolve(data);
return;
})
.catch((response) => {
reject(response);
});
});
}
getLike(value: string): Promise<TYPE[]> {
let self = this;
return new Promise((resolve, reject) => {
self
.gets()
.then((response: TYPE[]) => {
let data = DataTools.getNameLike(response, value);
if (isNullOrUndefined(data) || data.length === 0) {
reject('Data does not exist in the local BDD');
return;
}
resolve(data);
return;
})
.catch((response) => {
reject(response);
});
});
}
getOrder(): Promise<TYPE[]> {
let self = this;
return new Promise((resolve, reject) => {
self
.gets()
.then(async (response: TYPE[]) => {
let data = await DataTools.getsWhere(
response,
[
{
check: TypeCheck.NOT_EQUAL,
key: 'id',
value: [undefined, null],
},
],
['name', 'id']
);
resolve(data);
})
.catch((response) => {
console.log(
`[E] ${self.constructor.name}: can not retrieve BDD values`
);
reject(response);
});
});
}
}

View File

@ -40,7 +40,7 @@ export const useSpecificTrack = (id: number | undefined) => {
const dataTrack = useMemo(() => { const dataTrack = useMemo(() => {
return store.get(id); return store.get(id);
}, [store.data, id]); }, [store.data, id]);
return { dataTrack }; return { isLoading: store.isLoading, dataTrack };
}; };
/** /**
* Get all the track for a specific artist * Get all the track for a specific artist
@ -49,28 +49,22 @@ export const useSpecificTrack = (id: number | undefined) => {
*/ */
export const useTracksOfAnArtist = (idArtist?: number) => { export const useTracksOfAnArtist = (idArtist?: number) => {
const { store } = useTrackService(); const { store } = useTrackService();
const [tracksOnAnArtist, setTracksOnAnArtist] = useState<Track[]>([]); const tracksOnAnArtist = useMemo(() => {
useEffect(() => {
if (idArtist) { if (idArtist) {
const tmpFunction = async () => { return DataTools.getsWhere(
const data = await DataTools.getsWhere( store.data,
store.data, [
[ {
{ check: TypeCheck.CONTAINS,
check: TypeCheck.CONTAINS, key: 'artists',
key: 'artists', value: idArtist,
value: idArtist, },
}, ],
], ['track', 'name']
['track', 'name'] );
);
setTracksOnAnArtist(data);
};
tmpFunction();
} else {
setTracksOnAnArtist([]);
} }
}, [store.data, idArtist, setTracksOnAnArtist]); return [];
}, [store.data, idArtist]);
return { isLoading: store.isLoading, tracksOnAnArtist }; return { isLoading: store.isLoading, tracksOnAnArtist };
}; };
@ -80,12 +74,12 @@ export const useTracksOfAnArtist = (idArtist?: number) => {
* @returns The number of track present in this artist * @returns The number of track present in this artist
*/ */
export const useCountTracksOfAnArtist = (idArtist: number) => { export const useCountTracksOfAnArtist = (idArtist: number) => {
const { tracksOnAnAlbum } = useTracksOfAnAlbum(idArtist); const { isLoading, tracksOnAnAlbum } = useTracksOfAnAlbum(idArtist);
const countTracksOnAnArtist = useMemo( const countTracksOnAnArtist = useMemo(
() => tracksOnAnAlbum?.length ?? 0, () => tracksOnAnAlbum?.length ?? 0,
[tracksOnAnAlbum] [tracksOnAnAlbum]
); );
return { countTracksOnAnArtist }; return { isLoading, countTracksOnAnArtist };
}; };
/** /**
@ -95,29 +89,23 @@ export const useCountTracksOfAnArtist = (idArtist: number) => {
*/ */
export const useTracksOfAGender = (idGender?: number) => { export const useTracksOfAGender = (idGender?: number) => {
const { store } = useTrackService(); const { store } = useTrackService();
const [tracksOnAGender, setTracksOnAGender] = useState<Track[]>([]); const tracksOnAGender = useMemo(() => {
useEffect(() => {
if (idGender) { if (idGender) {
const tmpFunction = async () => { return DataTools.getsWhere(
const ret = await DataTools.getsWhere( store.data,
store.data, [
[ {
{ check: TypeCheck.CONTAINS,
check: TypeCheck.CONTAINS, key: 'genderId',
key: 'genderId', value: idGender,
value: idGender, },
}, ],
], ['name', 'track']
['name', 'track'] );
);
setTracksOnAGender(ret);
};
tmpFunction();
} else {
setTracksOnAGender([]);
} }
return [];
}, [store.data, idGender]); }, [store.data, idGender]);
return { tracksOnAGender }; return { isLoading: store.isLoading, tracksOnAGender };
}; };
/** /**
@ -126,12 +114,12 @@ export const useTracksOfAGender = (idGender?: number) => {
* @returns The number of track present in this artist * @returns The number of track present in this artist
*/ */
export const useCountTracksOfAGender = (idGender?: number) => { export const useCountTracksOfAGender = (idGender?: number) => {
const { tracksOnAGender } = useTracksOfAGender(idGender); const { isLoading, tracksOnAGender } = useTracksOfAGender(idGender);
const countTracksOnAGender = useMemo( const countTracksOnAGender = useMemo(
() => tracksOnAGender?.length ?? 0, () => tracksOnAGender?.length ?? 0,
[tracksOnAGender] [tracksOnAGender]
); );
return { countTracksOnAGender }; return { isLoading, countTracksOnAGender };
}; };
/** /**
@ -140,7 +128,7 @@ export const useCountTracksOfAGender = (idGender?: number) => {
* @returns the required List. * @returns the required List.
*/ */
export const useAlbumIdsOfAnArtist = (idArtist?: number) => { export const useAlbumIdsOfAnArtist = (idArtist?: number) => {
const { tracksOnAnArtist } = useTracksOfAnArtist(idArtist); const { isLoading, tracksOnAnArtist } = useTracksOfAnArtist(idArtist);
const albumIdsOfAnArtist = useMemo(() => { const albumIdsOfAnArtist = useMemo(() => {
// extract a single time all value "id" in an array // extract a single time all value "id" in an array
const listAlbumId = DataTools.extractLimitOne(tracksOnAnArtist, 'albumId'); const listAlbumId = DataTools.extractLimitOne(tracksOnAnArtist, 'albumId');
@ -153,34 +141,27 @@ export const useAlbumIdsOfAnArtist = (idArtist?: number) => {
return []; return [];
} }
}, [tracksOnAnArtist]); }, [tracksOnAnArtist]);
return { albumIdsOfAnArtist }; return { isLoading, albumIdsOfAnArtist };
}; };
export const useTracksOfAnAlbum = (idAlbum?: number) => { export const useTracksOfAnAlbum = (idAlbum?: number) => {
const { store } = useTrackService(); const { store } = useTrackService();
const [tracksOnAnAlbum, setTracksOnAnAlbum] = useState<Track[]>(); const tracksOnAnAlbum = useMemo(() => {
useEffect(() => {
if (idAlbum) { if (idAlbum) {
const tmpFunction = async () => { return DataTools.getsWhere(
const ret = await DataTools.getsWhere( store.data,
store.data, [
[ {
{ check: TypeCheck.EQUAL,
check: TypeCheck.EQUAL, key: 'albumId',
key: 'albumId', value: idAlbum,
value: idAlbum, },
}, ],
], ['track', 'name', 'id']
['track', 'name', 'id'] );
);
setTracksOnAnAlbum(ret);
};
tmpFunction();
} else {
setTracksOnAnAlbum([]);
} }
}, [store.data, idAlbum]); }, [store.data, idAlbum]);
return { tracksOnAnAlbum }; return { isLoading: store.isLoading, tracksOnAnAlbum };
}; };
/** /**
@ -189,12 +170,12 @@ export const useTracksOfAnAlbum = (idAlbum?: number) => {
* @returns The number of element present in this season * @returns The number of element present in this season
*/ */
export const useCountTracksWithAlbumId = (albumId?: number) => { export const useCountTracksWithAlbumId = (albumId?: number) => {
const { tracksOnAnAlbum } = useTracksOfAnAlbum(albumId); const { isLoading, tracksOnAnAlbum } = useTracksOfAnAlbum(albumId);
const countTracksOfAnAlbum = useMemo( const countTracksOfAnAlbum = useMemo(
() => tracksOnAnAlbum?.length ?? 0, () => tracksOnAnAlbum?.length ?? 0,
[tracksOnAnAlbum] [tracksOnAnAlbum]
); );
return { countTracksOfAnAlbum }; return { isLoading, countTracksOfAnAlbum };
}; };
/** /**
@ -204,35 +185,28 @@ export const useCountTracksWithAlbumId = (albumId?: number) => {
*/ */
export const useTracksOfArtistWithNoAlbum = (idArtist: number) => { export const useTracksOfArtistWithNoAlbum = (idArtist: number) => {
const { store } = useTrackService(); const { store } = useTrackService();
const [tracksOnAnArtistWithNoAlbum, setTracksOnAnArtistWithNoAlbum] = const tracksOnAnArtistWithNoAlbum = useMemo(() => {
useState<Track[]>([]);
useEffect(() => {
if (idArtist) { if (idArtist) {
const tmpFunction = async () => { return DataTools.getsWhere(
const ret = await DataTools.getsWhere( store.data,
store.data, [
[ {
{ check: TypeCheck.CONTAINS,
check: TypeCheck.CONTAINS, key: 'artists',
key: 'artists', value: idArtist,
value: idArtist, },
}, {
{ check: TypeCheck.EQUAL,
check: TypeCheck.EQUAL, key: 'albumId',
key: 'albumId', value: undefined,
value: undefined, },
}, ],
], ['track', 'name']
['track', 'name'] );
);
setTracksOnAnArtistWithNoAlbum(ret);
};
tmpFunction();
} else {
setTracksOnAnArtistWithNoAlbum([]);
} }
return [];
}, [store.data, idArtist]); }, [store.data, idArtist]);
return { tracksOnAnArtistWithNoAlbum }; return { isLoading: store.isLoading, tracksOnAnArtistWithNoAlbum };
}; };
/** /**
@ -245,23 +219,18 @@ export const useTracksWithStartName = (
invert: boolean invert: boolean
) => { ) => {
const { store } = useTrackService(); const { store } = useTrackService();
const [tracksStartsWith, setTracksStartsWith] = useState<Track[]>([]); const tracksStartsWith = useMemo(() => {
useEffect(() => { return DataTools.getsWhere(
const tmpFunction = async () => { store.data,
const ret = await DataTools.getsWhere( [
store.data, {
[ check: invert ? TypeCheck.STARTS_NOT_WITH : TypeCheck.STARTS_WITH,
{ key: 'name',
check: invert ? TypeCheck.STARTS_NOT_WITH : TypeCheck.STARTS_WITH, value: startName,
key: 'name', },
value: startName, ],
}, ['name', 'track']
], );
['name', 'track']
);
setTracksStartsWith(ret);
};
tmpFunction();
}, [store.data, startName, invert]); }, [store.data, startName, invert]);
return { isLoading: store.isLoading, tracksStartsWith }; return { isLoading: store.isLoading, tracksStartsWith };
}; };

View File

@ -6,7 +6,7 @@
import { DependencyList, useCallback, useEffect, useState } from 'react'; import { DependencyList, useCallback, useEffect, useState } from 'react';
import { RestErrorResponse } from '@/back-api'; import { RestErrorResponse } from '@/back-api';
import { isNullOrUndefined } from '@/utils/validator'; import { isArray, isNullOrUndefined } from '@/utils/validator';
export type DataStoreType<TYPE> = { export type DataStoreType<TYPE> = {
isLoading: boolean; isLoading: boolean;
@ -16,10 +16,6 @@ export type DataStoreType<TYPE> = {
gets: <MODEL>(value: MODEL[] | undefined, key?: string) => TYPE[]; gets: <MODEL>(value: MODEL[] | undefined, key?: string) => TYPE[];
}; };
function delay(ms: number) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
export const useDataStore = <TYPE>( export const useDataStore = <TYPE>(
{ {
primaryKey = 'id', primaryKey = 'id',
@ -42,13 +38,10 @@ export const useDataStore = <TYPE>(
setError(undefined); setError(undefined);
setIsLoading(true); setIsLoading(true);
getsCall() getsCall()
.then(async (response: TYPE[]) => { .then((response: TYPE[]) => {
/*console.log( /*console.log(
`[${restApiName}] getData Response: ${JSON.stringify(response, null, 2)}` `[${restApiName}] getData Response: ${JSON.stringify(response, null, 2)}`
);*/ );*/
console.log(`[${restApiName}] ${Date()} Receive data done (wait 10s)`);
await delay(10000);
console.log(`[${restApiName}] ${Date()} Ready`);
setData(response); setData(response);
setError(undefined); setError(undefined);
setIsLoading(false); setIsLoading(false);

View File

@ -85,15 +85,13 @@ export namespace DataTools {
bdd: TYPE[], bdd: TYPE[],
select: SelectModel[], select: SelectModel[],
orderByData?: string[] orderByData?: string[]
): Promise<TYPE[]> { ): TYPE[] {
return new Promise((resolve, _reject) => { // console.log("[I] gets_where " + this.name + " select " + _select);
// console.log("[I] gets_where " + this.name + " select " + _select); let tmpList = getSubList(bdd, select);
let tmpList = getSubList(bdd, select); if (tmpList && orderByData) {
if (tmpList && orderByData) { tmpList = orderBy(tmpList, orderByData);
tmpList = orderBy(tmpList, orderByData); }
} return tmpList;
resolve(tmpList);
});
} }
export function get<TYPE>( export function get<TYPE>(