Compare commits

..

5 Commits

5 changed files with 16 additions and 44 deletions

View File

@@ -1,6 +1,6 @@
{
"name": "api",
"version": "1.4.0",
"version": "1.3.1",
"description": "",
"author": "",
"private": true,

View File

@@ -2,9 +2,9 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/noahspan-logo.png" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Flying</title>
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>

View File

@@ -1,7 +1,7 @@
{
"name": "app",
"private": true,
"version": "1.4.0",
"version": "1.3.1",
"type": "module",
"scripts": {
"dev": "vite",

View File

@@ -1,4 +1,4 @@
import { Box, Card, CardContent, Container, Grid, Skeleton, Spinner, Stack, theme, Typography, useMediaQuery } from "@noahspan/noahspan-components";
import { Box, Container, Grid, Spinner } from "@noahspan/noahspan-components";
import LogbookCard from "../logbookCard/LogbookCard";
import { useEffect, useState } from "react";
import { useLogs } from "../../hooks/logs/UseLogs";
@@ -7,7 +7,6 @@ import { ILogbookEntry } from "../logbook/ILogbookEntry";
const Flights = () => {
const [flights, setFlights] = useState<ILogbookEntry[]>([]);
const { logs, isLoading } = useLogs();
const isMedium = useMediaQuery(theme.breakpoints.up('md'));
useEffect(() => {
const flights: ILogbookEntry[] | undefined = logs?.filter((log: ILogbookEntry) => {
@@ -25,48 +24,21 @@ const Flights = () => {
<Container>
<Box sx={{ margin: '20px' }}>
<Grid container spacing={2}>
<Grid size={isMedium ? 11 : 6}>
<Typography variant="h4">Flights</Typography>
</Grid>
{isLoading &&
<>
<Grid display="flex" justifyContent="center" size={12}>
<Spinner />
</Grid>
<Grid display="flex" justifyContent="center" size={12}>
Loading...
</Grid>
</>
}
{!isLoading &&
<Grid size={12}>
<LogbookCard logs={flights} mode='flights' />
</Grid>
}
{isLoading && [...Array(6)].map((_element, index) => {
return (
<Grid display='flex' justifyContent='center' size={12}>
<Card
key={index}
sx={{
width: '100%'
}}
>
<CardContent>
<Grid container>
<Grid size={12}>
<Skeleton height={60} width={200} />
<Skeleton height={30} width={200} />
</Grid>
<Grid size={12}>
<Skeleton height={300} />
</Grid>
<Grid size={12}>
{[...Array(4)].map((_element, index) => {
return (
<>
<Skeleton height={20} width={300} />
<Skeleton height={40} width={300} />
</>
)
})}
</Grid>
</Grid>
</CardContent>
</Card>
</Grid>
)
})}
</Grid>
</Box>
</Container>

View File

@@ -1,6 +1,6 @@
{
"name": "@noahspan/flying",
"version": "1.4.0",
"version": "1.3.0",
"scripts": {
"start": "concurrently 'npm run start:azure -w api' 'wait-on tcp:0.0.0.0:7071 && npm run dev -w app'",
"format": "prettier --write \"**/src/**/*.ts\" \"**/test/**/*.ts\"",