loan/user-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/error_pages' into 'develop'

Browse Source 
Feature/error pages

See merge request witel3/loan-facilities-user!20
This commit is contained in:
AmirHossein Mahmoodi
2023-08-05 11:37:39 +00:00
parent c2751ea0ff daf4677e37
commit 35ad9463e4
12 changed files with 228 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
public/images/403.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

1
public/images/404.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

1
public/images/500.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

12
public/locales/fa/app.json
View File

@@ -34,7 +34,17 @@
"title_login_welfare_services_page": "ورود اعضای خدمات رفاهی",
"title_register_navy_page": "ثبت نام اعضای ناوگان",
"title_register_welfare_services_page": "ثبت نام اعضای خدمات رفاهی",
"title_not_found": "یافت نشد"
"title_custom_404": "صفحه یافت نشد",
"title_custom_403": "عدم دسترسی",
"title_custom_500": "خطای سرور"
},
"ErrorPage": {
"custom_404": "صفحه مورد نظر یافت نشد | 404",
"custom_500": "دسترسی به سامانه امکانپذیر نمی باشد دقایقی دیگر تلاش نمائید | 500",
"custom_403": "شما دسترسی به این بخش را ندارید | 403",
"link_routing_back_to": "بازگشت به",
"link_routing_previuos_page": "صفحه قبل",
"link_routing_main_page": "صفحه اصلی"
},
"sidebar": {
"dashboard": "داشبورد",

38
src/components/NotFound.jsx
View File

@@ -1,38 +0,0 @@
import CenterLayout from "@/layouts/CenterLayout";
import FullPageLayout from "@/layouts/FullPageLayout";
import {Box, Button, Typography} from "@mui/material";
import {NextLinkComposed} from "@/core/components/LinkRouting";
import {useTranslations} from "next-intl";
import Image from "next/image";
const NotFoundComponent = () => {
const t = useTranslations();
return (
<FullPageLayout sx={{p: 1}}>
<CenterLayout>
<Box sx={{position: "relative", width: "100%", height: 250}}>
<Image
fill
src="/images/not-found.svg"
alt="not found image"
priority
/>
</Box>
<Typography margin={2} variant="h6" textAlign="center">
صفحه ای با این عنوان یافت نشد
</Typography>
<Button
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/dashboard",
}}
>
رفتن به داشبورد
</Button>
</CenterLayout>
</FullPageLayout>
);
};
export default NotFoundComponent;

48
src/components/errors/403.jsx Normal file
View File

@@ -0,0 +1,48 @@
import CenterLayout from "@/layouts/CenterLayout";
import FullPageLayout from "@/layouts/FullPageLayout";
import {Box, Button, Container, Stack, Typography} from "@mui/material";
import {NextLinkComposed} from "@/core/components/LinkRouting";
import {useTranslations} from "next-intl";
import Image from "next/image";
import TitlePage from "@/core/components/TitlePage";
const UnAuthorizedComponent = () => {
const t = useTranslations();
return (
<>
<TitlePage text="Titles.title_custom_403"/>
<FullPageLayout sx={{p: 1}}>
<CenterLayout>
<Container maxWidth="sm">
<Stack spacing={4} sx={{p: 4}}>
<Box sx={{position: "relative", width: "100%", height: 200}}>
<Image
fill
src="/images/403.svg"
alt={t("app_name")}
priority
/>
</Box>
<Typography margin={2} variant="h6" textAlign="center">
{t("ErrorPage.custom_403")}
</Typography>
<Button
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/",
}}
>
{t("ErrorPage.link_routing_back_to")}{" "}
{t("ErrorPage.link_routing_main_page")}
</Button>
</Stack>
</Container>
</CenterLayout>
</FullPageLayout>
</>
);
};
export default UnAuthorizedComponent;

48
src/components/errors/404.jsx Normal file
View File

@@ -0,0 +1,48 @@
import CenterLayout from "@/layouts/CenterLayout";
import FullPageLayout from "@/layouts/FullPageLayout";
import {Box, Button, Container, Stack, Typography} from "@mui/material";
import {NextLinkComposed} from "@/core/components/LinkRouting";
import {useTranslations} from "next-intl";
import Image from "next/image";
import TitlePage from "@/core/components/TitlePage";
const NotFoundComponent = () => {
const t = useTranslations();
return (
<>
<TitlePage text="Titles.title_custom_404"/>
<FullPageLayout sx={{p: 1}}>
<CenterLayout>
<Container maxWidth="sm">
<Stack spacing={4} sx={{p: 4}}>
<Box sx={{position: "relative", width: "100%", height: 200}}>
<Image
fill
src="/images/404.svg"
alt={t("app_name")}
priority
/>
</Box>
<Typography margin={2} variant="h6" textAlign="center">
{t("ErrorPage.custom_404")}
</Typography>
<Button
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/",
}}
>
{t("ErrorPage.link_routing_back_to")}{" "}
{t("ErrorPage.link_routing_main_page")}
</Button>
</Stack>
</Container>
</CenterLayout>
</FullPageLayout>
</>
);
};
export default NotFoundComponent;

48
src/components/errors/500.jsx Normal file
View File

@@ -0,0 +1,48 @@
import CenterLayout from "@/layouts/CenterLayout";
import FullPageLayout from "@/layouts/FullPageLayout";
import {Box, Button, Container, Stack, Typography} from "@mui/material";
import {NextLinkComposed} from "@/core/components/LinkRouting";
import {useTranslations} from "next-intl";
import Image from "next/image";
import TitlePage from "@/core/components/TitlePage";
const ServerErrorComponent = () => {
const t = useTranslations();
return (
<>
<TitlePage text="Titles.title_custom_500"/>
<FullPageLayout sx={{p: 1}}>
<CenterLayout>
<Container maxWidth="sm">
<Stack spacing={4} sx={{p: 4}}>
<Box sx={{position: "relative", width: "100%", height: 200}}>
<Image
fill
src="/images/500.svg"
alt={t("app_name")}
priority
/>
</Box>
<Typography margin={2} variant="h6" textAlign="center">
{t("ErrorPage.custom_500")}
</Typography>
<Button
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/",
}}
>
{t("ErrorPage.link_routing_back_to")}{" "}
{t("ErrorPage.link_routing_main_page")}
</Button>
</Stack>
</Container>
</CenterLayout>
</FullPageLayout>
</>
);
};
export default ServerErrorComponent;

24
src/pages/403.jsx Normal file
View File

@@ -0,0 +1,24 @@
import {useEffect, useState} from "react";
import {useRouter} from "next/router";
import {NextIntlProvider} from "next-intl";
import UnAuthorizedComponent from "@/components/errors/403";
export default function Custom404() {
const router = useRouter()
const [messages, setMessages] = useState(null)
useEffect(() => {
const fetch = async () => {
const tempMessages = (await import(`&/locales/${router.locale}/app.json`)).default
setMessages(tempMessages)
}
fetch()
}, []);
if (!messages) return
return (
<NextIntlProvider messages={messages}>
<UnAuthorizedComponent/>
</NextIntlProvider>
);
}

28
src/pages/404.jsx
View File

@@ -1,13 +1,25 @@
import NotFoundComponent from "@/components/NotFound";
import Head from "next/head";
import {useEffect, useState} from "react";
import {useRouter} from "next/router";
import {NextIntlProvider} from "next-intl";
import NotFoundComponent from "@/components/errors/404";
export default function Custom404() {
const router = useRouter()
const [messages, setMessages] = useState(null)
useEffect(() => {
const fetch = async () => {
const tempMessages = (await import(`&/locales/${router.locale}/app.json`)).default
setMessages(tempMessages)
}
fetch()
}, []);
if (!messages) return
export default function NotFound() {
return (
<>
<Head>
<title>یافت نشد</title>
</Head>
<NextIntlProvider messages={messages}>
<NotFoundComponent/>
</>
</NextIntlProvider>
);
}

24
src/pages/500.jsx Normal file
View File

@@ -0,0 +1,24 @@
import {useEffect, useState} from "react";
import {useRouter} from "next/router";
import {NextIntlProvider} from "next-intl";
import ServerErrorComponent from "@/components/errors/500";
export default function Custom500() {
const router = useRouter()
const [messages, setMessages] = useState(null)
useEffect(() => {
const fetch = async () => {
const tempMessages = (await import(`&/locales/${router.locale}/app.json`)).default
setMessages(tempMessages)
}
fetch()
}, []);
if (!messages) return
return (
<NextIntlProvider messages={messages}>
<ServerErrorComponent/>
</NextIntlProvider>
);
}

4
src/pages/_app.jsx
View File

@@ -13,9 +13,9 @@ const App = ({Component, pageProps}) => {
<>
<UserProvider>
<LanguageProvider>
<NextIntlProvider messages={pageProps.messages}>
<NextIntlProvider messages={pageProps.messages || {}}>
<MuiLayout isBot={pageProps.isBot}>
<TitlePage text={pageProps.title}/>
{pageProps.message ? <TitlePage text={pageProps.title}/> : ''}
<LoadingProvider>
<AppLayout isBot={pageProps.isBot}>
<Component {...pageProps} />