mirror of
https://github.com/Zagrios/bs-manager.git
synced 2026-07-03 14:08:25 +02:00
add loading maps
This commit is contained in:
+15
-7
@@ -11,6 +11,7 @@ import { BsmImage } from "../shared/bsm-image.component"
|
||||
import BeatConflict from "../../../../assets/images/apngs/beat-conflict.png"
|
||||
import { BsmButton } from "../shared/bsm-button.component"
|
||||
import { useTranslation } from "renderer/hooks/use-translation.hook"
|
||||
import BeatWaitingImg from "../../../../assets/images/apngs/beat-waiting.png"
|
||||
|
||||
type Props = {
|
||||
version: BSVersion,
|
||||
@@ -26,7 +27,7 @@ export const LocalMapsListPanel = forwardRef(({version, className, filter, searc
|
||||
|
||||
const ref = useRef(null)
|
||||
const isVisible = useInView(ref, {once: true});
|
||||
const [maps, setMaps] = useState<BsmLocalMap[]>([]);
|
||||
const [maps, setMaps] = useState<BsmLocalMap[]>(null);
|
||||
const [subs] = useState<Subscription[]>([]);
|
||||
const [selectedMaps, setSelectedMaps] = useState([]);
|
||||
const t = useTranslation();
|
||||
@@ -51,7 +52,7 @@ export const LocalMapsListPanel = forwardRef(({version, className, filter, searc
|
||||
}
|
||||
|
||||
return () => {
|
||||
setMaps(() => []);
|
||||
setMaps(() => null);
|
||||
subs.forEach(s => s.unsubscribe());
|
||||
mapsDownloader.removeOnMapDownloadedListene(loadMaps);
|
||||
}
|
||||
@@ -248,11 +249,18 @@ export const LocalMapsListPanel = forwardRef(({version, className, filter, searc
|
||||
<div ref={ref} className={className}>
|
||||
<ul className="p-3 w-full grow flex flex-wrap justify-center content-start gap-2 overflow-y-scroll scrollbar-thin scrollbar-thumb-rounded-full scrollbar-thumb-neutral-900">
|
||||
{maps?.length ? renderMaps() : (
|
||||
<div className="h-full flex flex-col items-center justify-center flex-wrap gap-1">
|
||||
<BsmImage className="h-32" image={BeatConflict}/>
|
||||
<span className="font-bold">{t("pages.version-viewer.maps.tabs.maps.empty-maps.text")}</span>
|
||||
<BsmButton className="font-bold rounded-md p-2" text="pages.version-viewer.maps.tabs.maps.empty-maps.button" typeColor="primary" withBar={false} onClick={e => {e.preventDefault(); mapsDownloader.openDownloadMapModal(version)}}/>
|
||||
</div>
|
||||
maps === null ? (
|
||||
<div className="h-full flex flex-col items-center justify-center flex-wrap gap-1">
|
||||
<img className="w-32 h-32 spin-loading" src={BeatWaitingImg} alt=" "/>
|
||||
<span className="font-bold">{t("modals.download-maps.loading-maps")}</span>
|
||||
</div>
|
||||
) : (
|
||||
<div className="h-full flex flex-col items-center justify-center flex-wrap gap-1">
|
||||
<BsmImage className="h-32" image={BeatConflict}/>
|
||||
<span className="font-bold">{t("pages.version-viewer.maps.tabs.maps.empty-maps.text")}</span>
|
||||
<BsmButton className="font-bold rounded-md p-2" text="pages.version-viewer.maps.tabs.maps.empty-maps.button" typeColor="primary" withBar={false} onClick={e => {e.preventDefault(); mapsDownloader.openDownloadMapModal(version)}}/>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user