This commit is contained in:
Hugo Lextrait 2023-04-13 17:58:40 +02:00
commit 88c13c7c03
9 changed files with 146 additions and 83 deletions

View File

@ -21,5 +21,5 @@ version: 0.0.1
# incremented each time you make changes to the application. Versions are not expected to
# follow Semantic Versioning. They should reflect the version the application is using.
# It is recommended to use it with quotes.
appVersion: 0.2.5
appVersion: 0.3.7

View File

@ -11,6 +11,8 @@ const nextConfig = {
BACK_API_VERSION: process.env.BACK_API_VERSION,
FRONT_APP_HOST: process.env.FRONT_APP_HOST,
FRONT_APP_PORT: process.env.FRONT_APP_PORT,
IDNOT_AUTHORIZE_ENDPOINT: process.env.IDNOT_AUTHORIZE_ENDPOINT,
IDNOT_CLIENT_ID: process.env.IDNOT_CLIENT_ID,
},
};

View File

@ -1,5 +1,6 @@
import { Service } from "typedi";
import BaseApiService from "@Front/Api/BaseApiService";
import { FrontendVariables } from "@Front/Config/VariablesFront";
@Service()
export default class Auth extends BaseApiService {
@ -10,30 +11,21 @@ export default class Auth extends BaseApiService {
}
public static getInstance(): Auth {
return (this.instance = this.instance ?? new Auth());
return (this.instance = this.instance ?? new this());
}
public async userSignin() {
const url = new URL(
"https://qual-connexion.idnot.fr/IdPOAuth2/authorize/idnot_idp_v1?client_id=4501646203F3EF67&redirect_uri=http://0.0.0.0:3000/authorized-client&scope=openid,profile,offline_access&response_type=code"
);
public async getIdnotJwt(autorizationCode: string | string[]): Promise<any> {
const variables = FrontendVariables.getInstance();
const baseBackUrl =
variables.BACK_API_PROTOCOL +
variables.BACK_API_HOST +
(variables.BACK_API_PORT ? ":" + variables.BACK_API_PORT : "");
const url = new URL(`${baseBackUrl}/api/v1/idnot-user/${autorizationCode}`);
try {
return await this.getRequest<any>(url);
return await this.postRequest<any>(url);
} catch (err) {
this.onError(err);
return Promise.reject(err);
}
}
public async getIdnotJwt(autorizationCode: string | string[]) {
const url = new URL(
`http://127.0.0.1:3001/api/v1/idnot-user/${autorizationCode}`
);
try {
await this.postRequest<any>(url);
} catch (err) {
this.onError(err);
//return Promise.reject(err);
}
}
}

View File

@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.4351 10.0629H10.7124L10.4563 9.81589C11.3528 8.77301 11.8925 7.4191 11.8925 5.94625C11.8925 2.66209 9.23042 0 5.94625 0C2.66209 0 0 2.66209 0 5.94625C0 9.23042 2.66209 11.8925 5.94625 11.8925C7.4191 11.8925 8.77301 11.3528 9.81589 10.4563L10.0629 10.7124V11.4351L14.6369 16L16 14.6369L11.4351 10.0629ZM5.94625 10.0629C3.66838 10.0629 1.82962 8.22413 1.82962 5.94625C1.82962 3.66838 3.66838 1.82962 5.94625 1.82962C8.22413 1.82962 10.0629 3.66838 10.0629 5.94625C10.0629 8.22413 8.22413 10.0629 5.94625 10.0629Z" fill="#939393"/>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 645 B

After

Width:  |  Height:  |  Size: 644 B

View File

@ -29,10 +29,10 @@ export default class ClientSection extends React.Component<IProps, IState> {
}
private renderCustomerFolders() {
const output = this.props.folder.office_folder_has_customers?.map((folderHasCustomer) => {
const output = this.props.folder.office_folder_has_customers?.map((folderHasCustomer, key) => {
if (!folderHasCustomer.customer) return null;
// TODO : Les documents ASKED fonctionne mais les autres documents ne doivcent etre seulement ceux qui correspondent au folder
return <div className={classes["user-folder"]}><UserFolder folder={this.props.folder} customer={folderHasCustomer.customer} key={folderHasCustomer.customer.uid} /></div>;
return <div className={classes["user-folder"]} key={folderHasCustomer.customer.uid}><UserFolder folder={this.props.folder} customer={folderHasCustomer.customer} /></div>;
})
return output ?? null;
}

View File

@ -3,34 +3,47 @@ import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import BasePage from "../Base";
import classes from "./classes.module.scss";
import CoffreIcon from "@Assets/Icons/coffre.svg";
import LandingImage from "./landing-connect.png"
import LandingImage from "./landing-connect.png";
import Image from "next/image";
import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
import { FrontendVariables } from "@Front/Config/VariablesFront";
export default class LoginClass extends BasePage {
public override render(): JSX.Element {
return (
<DefaultDoubleSidePage title={"Login"} image={LandingImage}>
<div className={classes["root"]}>
<Image alt="coffre" src={CoffreIcon} />
<Typography typo={ITypo.H1}><div className={classes["title"]}>Connexion espace professionnel</div></Typography>
<Button onClick={this.redirectUserOnConnection}>Sidentifier avec ID.not</Button>
<Typography typo={ITypo.P_18}><div className={classes["forget-password"]}>Vous narrivez pas à vous connecter ?</div></Typography>
<Button variant={EButtonVariant.LINE} >Contacter ladministrateur</Button>
</div>
</DefaultDoubleSidePage>
);
}
public override render(): JSX.Element {
return (
<DefaultDoubleSidePage title={"Login"} image={LandingImage}>
<div className={classes["root"]}>
<Image alt="coffre" src={CoffreIcon} />
<Typography typo={ITypo.H1}>
<div className={classes["title"]}>
Connexion espace professionnel
</div>
</Typography>
<Button onClick={this.redirectUserOnConnection}>
Sidentifier avec ID.not
</Button>
<Typography typo={ITypo.P_18}>
<div className={classes["forget-password"]}>
Vous narrivez pas à vous connecter ?
</div>
</Typography>
<Button variant={EButtonVariant.LINE}>
Contacter ladministrateur
</Button>
</div>
</DefaultDoubleSidePage>
);
}
private redirectUserOnConnection() {
// check variable
const baseFronturl = FrontendVariables.getInstance().BACK_API_PROTOCOL +
FrontendVariables.getInstance().FRONT_APP_HOST +
(FrontendVariables.getInstance().FRONT_APP_PORT ? ":" + FrontendVariables.getInstance().FRONT_APP_PORT : "");
const url = `https://qual-connexion.idnot.fr/IdPOAuth2/authorize/idnot_idp_v1?client_id=4501646203F3EF67&redirect_uri=${baseFronturl}/authorized-client&scope=openid,profile,offline_access&response_type=code`
window.location.assign(url)
}
}
private redirectUserOnConnection() {
const variables = FrontendVariables.getInstance();
const baseFronturl =
variables.BACK_API_PROTOCOL +
variables.FRONT_APP_HOST +
(variables.FRONT_APP_PORT ? ":" + variables.FRONT_APP_PORT : "");
const authorizeEndPoint = variables.IDNOT_AUTHORIZE_ENDPOINT;
const clientId = variables.IDNOT_CLIENT_ID;
const url = `${authorizeEndPoint}?client_id=${clientId}&redirect_uri=${baseFronturl}/authorized-client&scope=openid,profile,offline_access&response_type=code`;
window.location.assign(url);
}
}

View File

@ -1,45 +1,90 @@
import classes from "./classes.module.scss";
import LandingImage from "../Login/landing-connect.png";
import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
import Router, { useRouter } from "next/router";
// import classes from "./classes.module.scss";
// import LandingImage from "../Login/landing-connect.png";
// import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
// import Image from "next/image";
// import CoffreIcon from "@Assets/Icons/coffre.svg";
// import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
// import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import { useRouter } from "next/router";
//import React, { useEffect, useState } from "react";
import React from "react";
import Loader from "@Front/Components/DesignSystem/Loader";
//import Loader from "@Front/Components/DesignSystem/Loader";
import Auth from "@Front/Api/Auth/IdNot";
import Folder from "../Folder";
import LoginClass from "../Login";
type IPropsClass = {};
type IPropsClass = {};
type IStateClass = {};
// type IStateClass = {};
class LoginCallBackClass extends React.Component<IPropsClass, IStateClass> {
public override render(): JSX.Element {
return (
<DefaultDoubleSidePage title={"Login"} image={LandingImage}>
<div className={classes["root"]}>
<Loader />
</div>
</DefaultDoubleSidePage>
);
}
}
// class LoginCallBackClass extends React.Component<IPropsClass, IStateClass> {
// public override render(): JSX.Element {
// return (
// <DefaultDoubleSidePage title={"Login"} image={LandingImage}>
// <div className={classes["root"]}>
// <Image alt="coffre" src={CoffreIcon} />
// <Typography typo={ITypo.H1}>
// <div className={classes["title"]}>
// Connexion espace professionnel
// </div>
// </Typography>
// <Loader />
// <Typography typo={ITypo.P_18}>
// <div className={classes["forget-password"]}>
// Vous narrivez pas à vous connecter ?
// </div>
// </Typography>
// <Button variant={EButtonVariant.LINE}>
// Contacter ladministrateur
// </Button>
// </div>
// </DefaultDoubleSidePage>
// );
// }
// }
// TODO: Refacto with functionnal component container of classcomponent
// export default function LoginCallBack(props: IPropsClass) {
// const [user, setUser] = useState(null);
// const [isLoading, setIsLoading] = useState(false);
// const router = useRouter();
// const { code } = router.query;
// if (code) {
// useEffect(() => {
// const getIdNotJwt = async () => {
// setIsLoading(true);
// try {
// const authService = Auth.getInstance();
// const fetchedUser = await authService.getIdnotJwt(code);
// setUser(fetchedUser);
// } catch (error) {
// console.error(error);
// // Router.push('/login');
// }
// };
// getIdNotJwt();
// }, []);
// if (isLoading) return <LoginCallBackClass {... props}/>
// return <Folder {...props} />;
// }
// return <LoginClass {...props}/>
// }
export default function LoginCallBack(props: IPropsClass) {
const router = useRouter();
const { code } = router.query;
if (code) {
const getIdNotJwt = async () => {
try {
const authService = Auth.getInstance();
const user = await authService.getIdnotJwt(code);
console.log(user);
Router.push('/dossier');
} catch (error) {
console.error(error);
Router.push('/login');
}
};
getIdNotJwt();
const router = useRouter();
const { code } = router.query;
if (code) {
const getIdNotJwt = async () => {
try {
const authService = Auth.getInstance();
await authService.getIdnotJwt(code);
} catch (error) {
console.error(error);
}
};
getIdNotJwt();
return <Folder {...props} />;
}
return <LoginClass {...props}/>
}
return <LoginCallBackClass {...props} />;
}

View File

@ -15,6 +15,10 @@ export class FrontendVariables {
public FRONT_APP_PORT!: string;
public IDNOT_AUTHORIZE_ENDPOINT!: string;
public IDNOT_CLIENT_ID!: string;
private constructor() {}
public static getInstance(): FrontendVariables {

View File

@ -19,9 +19,11 @@ type AppPropsWithLayout = AppProps & {
backApiVersion: string,
frontAppHost: string,
frontAppPort: string,
idNotAuthorizeEndpoint: string;
idNotClientId: string;
};
const MyApp = (({ Component, pageProps, backApiProtocol, backApiHost, backApiPort, backApiRootUrl, backApiVersion, frontAppHost, frontAppPort }: AppPropsWithLayout) => {
const MyApp = (({ Component, pageProps, backApiProtocol, backApiHost, backApiPort, backApiRootUrl, backApiVersion, frontAppHost, frontAppPort, idNotAuthorizeEndpoint, idNotClientId }: AppPropsWithLayout) => {
const getLayout = Component.getLayout ?? ((page) => <DefaultLayout children={page}></DefaultLayout>);
FrontendVariables.getInstance().BACK_API_PROTOCOL = backApiProtocol;
@ -31,6 +33,9 @@ const MyApp = (({ Component, pageProps, backApiProtocol, backApiHost, backApiPor
FrontendVariables.getInstance().BACK_API_VERSION = backApiVersion;
FrontendVariables.getInstance().FRONT_APP_HOST = frontAppHost;
FrontendVariables.getInstance().FRONT_APP_PORT = frontAppPort;
FrontendVariables.getInstance().IDNOT_AUTHORIZE_ENDPOINT = idNotAuthorizeEndpoint;
FrontendVariables.getInstance().IDNOT_CLIENT_ID = idNotClientId;
return getLayout(<Component {...pageProps} />);
}) as AppType;
@ -44,6 +49,8 @@ MyApp.getInitialProps = async () => {
backApiVersion: process.env["BACK_API_VERSION"],
frontAppHost: process.env["FRONT_APP_HOST"],
frontAppPort: process.env["FRONT_APP_PORT"],
idNotAuthorizeEndpoint: process.env["IDNOT_AUTHORIZE_ENDPOINT"],
idNotClientId: process.env["IDNOT_CLIENT_ID"],
};
}