docs: ✨ display styled pages when signIn and unauthorized
Signed-off-by: slumbering <slumbering.pierrot@gmail.com>
This commit is contained in:
parent
38ee07e5f9
commit
f693032cc1
@ -1,6 +1,6 @@
|
||||
import React from "react";
|
||||
import { GithubLoginButton } from 'react-social-login-buttons';
|
||||
import style from './DocAuthentication.module.css'
|
||||
import style from './DocPageAuthentication.module.css'
|
||||
|
||||
export default function DocAuthentication() {
|
||||
return (
|
29
website/src/components/DocPageRedirect.js
Normal file
29
website/src/components/DocPageRedirect.js
Normal file
@ -0,0 +1,29 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import style from './DocPageRedirect.module.css'
|
||||
|
||||
|
||||
export default function DocPageRedirect() {
|
||||
const [counter, setCounter] = useState(10)
|
||||
|
||||
useEffect(() => {
|
||||
setTimeout(() => window.location.href = "https://dagger.io", 10000)
|
||||
setInterval(() => setCounter((prevState) => prevState - 1), 1000)
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className={`container ${style.wrapper}`}>
|
||||
<div className={`row ${style.row}`}>
|
||||
<div className="col col--4 col--offset-2">
|
||||
<h1 className={style.h1}>Oups!</h1>
|
||||
<p>It seems you don't have the permission to see Dagger's documentation. But don't worry you can request an Eary Access :). You'll be redirect to Dagger website in {counter} seconds </p>
|
||||
<p>See you soon !</p>
|
||||
<br />
|
||||
<small><strong>If nothing happen, <a href="https://dagger.io">click here</a> to go to Dagger website</strong></small>
|
||||
</div>
|
||||
<div className="col col--4">
|
||||
<img src="/img/dagger-astronaute.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
25
website/src/components/DocPageRedirect.module.css
Normal file
25
website/src/components/DocPageRedirect.module.css
Normal file
@ -0,0 +1,25 @@
|
||||
.wrapper {
|
||||
background: linear-gradient(180deg, #131226, #0e2b3d);
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: var(--ifm-color-primary-light);
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wrapper a {
|
||||
color: var(--ifm-color-primary-light);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.h1 {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.row {
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
@ -24,7 +24,8 @@ import isEmpty from 'lodash/isEmpty';
|
||||
import { checkUserCollaboratorStatus, getUser } from '../../api/github'
|
||||
import { GithubLoginButton } from 'react-social-login-buttons';
|
||||
import Spinner from '../../components/Spinner';
|
||||
import DocAuthentication from '../../components/DocAuthentication';
|
||||
import DocPageAuthentication from '../../components/DocPageAuthentication';
|
||||
import DocPageRedirect from '../../components/DocPageRedirect';
|
||||
|
||||
function DocPageContent({ currentDocRoute, versionMetadata, children }) {
|
||||
const { siteConfig, isClient } = useDocusaurusContext();
|
||||
@ -168,12 +169,12 @@ function DocPage(props) {
|
||||
if (isLoading) return <Spinner />
|
||||
|
||||
if ((isUserAuthorized?.status && isUserAuthorized?.status === 401)) {
|
||||
return <p>Redirection vers dagger.io...</p>
|
||||
return <DocPageRedirect />
|
||||
}
|
||||
|
||||
if (!isUserAuthorized) {
|
||||
return (
|
||||
<DocAuthentication />
|
||||
<DocPageAuthentication />
|
||||
)
|
||||
}
|
||||
|
||||
|
BIN
website/static/img/dagger-astronaute.png
Normal file
BIN
website/static/img/dagger-astronaute.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 59 KiB |
Reference in New Issue
Block a user