Neshweb-Sites/main-site
Neshweb-Sites/main-site
1
0
Fork 0
Code Issues 2 Pull requests Releases 9 Packages Activity Actions

Added usage of MobileCard type on Service page

Browse source
This commit is contained in:
Neshura 2022-12-23 18:41:10 +01:00
parent b9540478e5
commit ce0a7c43c0
No known key found for this signature in database
GPG key ID: ACDF5B6EBECF6B0A
1 changed files with 35 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
pages/services.tsx
View file

@ -4,31 +4,54 @@ import Dockerode from 'dockerode';
import { ReactElement } from 'react' import { ReactElement } from 'react'
import useSWR from 'swr'; import useSWR from 'swr';
import { CardContentService, PageContentBox, PageDescription, PageTitle } from '../components/styles/content'; import { CardContentService, PageContentBox, PageDescription, PageTitle } from '../components/styles/content';
import { ServiceCardMobile } from '../components/styles/cards/mobile';
import ServiceList from '../public/pages.json'; import ServiceList from '../public/pages.json';
import useWindowSize from '../components/windowsize';
const fetcher = (url: string) => fetch(url).then((res) => res.json()) const fetcher = (url: string) => fetch(url).then((res) => res.json())
function Services() { function Services() {
const { initialData, fullData, loadingFull, error } = useServices(); const { initialData, fullData, loadingFull, error } = useServices();
const isMobile = useWindowSize();
let content: ReactElement = <></>; let content: ReactElement = <></>;
if (error) { content = <div>Error loading data</div> } if (error) { content = <div>Error loading data</div> }
else if (loadingFull) { else if (loadingFull) {
content = if (isMobile) {
<PageContentBox> content =
{initialData?.map((item: Service) => ( <PageContentBox>
<CardContentService key={item.name} content={item} /> {initialData?.map((item: Service) => (
))} <ServiceCardMobile key={item.name} content={item} />
</PageContentBox> ))}
</PageContentBox>
}
else {
content =
<PageContentBox>
{initialData?.map((item: Service) => (
<CardContentService key={item.name} content={item} />
))}
</PageContentBox>
}
} }
else if (fullData) { else if (fullData) {
content = if (isMobile) {
<PageContentBox> content =
{fullData.map((item: Service) => ( <PageContentBox>
<CardContentService key={item.name} content={item} /> {fullData.map((item: Service) => (
))} <ServiceCardMobile key={item.name} content={item} />
</PageContentBox> ))}
</PageContentBox>
}
else {
content =
<PageContentBox>
{fullData.map((item: Service) => (
<CardContentService key={item.name} content={item} />
))}
</PageContentBox>
}
} }
else { else {
content = <div>Error loading data</div> content = <div>Error loading data</div>