Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-09 15:05:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

✨ Add skeleton while the meto module is loading

Browse Source
This commit is contained in:
Thomas Camlong
2022-07-07 07:13:11 +00:00
committed by GitHub
parent 2702c9a7cf
commit 0406d6d5ee
1 changed files with 13 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/modules/weather/WeatherModule.tsx
View File

@@ -1,4 +1,4 @@
import { Group, Space, Title, Tooltip } from '@mantine/core'; import { Group, Space, Title, Tooltip, Skeleton } from '@mantine/core';
import axios from 'axios'; import axios from 'axios';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { import {
@@ -157,7 +157,18 @@ export default function WeatherComponent(props: any) {
}); });
}, [cityInput]); }, [cityInput]);
if (!weather.current_weather) { if (!weather.current_weather) {
return null; return (
<>
<Skeleton height={40} width={100} mb="xl" />
<Group noWrap direction="row">
<Skeleton height={50} circle />
<Group>
<Skeleton height={25} width={70} mr="lg" />
<Skeleton height={25} width={70} />
</Group>
</Group>
</>
);
} }
function usePerferedUnit(value: number): string { function usePerferedUnit(value: number): string {
return isFahrenheit ? `${(value * (9 / 5) + 32).toFixed(1)}°F` : `${value.toFixed(1)}°C`; return isFahrenheit ? `${(value * (9 / 5) + 32).toFixed(1)}°F` : `${value.toFixed(1)}°C`;