🎨 format all documents
This commit is contained in:
parent
c4659e99e8
commit
ff0e493b67
6
.vscode/settings.json
vendored
6
.vscode/settings.json
vendored
@ -4,6 +4,9 @@
|
|||||||
"[typescript]": {
|
"[typescript]": {
|
||||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
},
|
},
|
||||||
|
"[typescriptreact]": {
|
||||||
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
|
},
|
||||||
"[json]": {
|
"[json]": {
|
||||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
},
|
},
|
||||||
@ -13,6 +16,9 @@
|
|||||||
"[javascript]": {
|
"[javascript]": {
|
||||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
},
|
},
|
||||||
|
"[scss]": {
|
||||||
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
|
},
|
||||||
"terminal.integrated.env.linux": {
|
"terminal.integrated.env.linux": {
|
||||||
"PATH": "${env:HOME}/elrondsdk/vendor-rust/bin:${env:HOME}/elrondsdk/erdpy-venv/bin:${env:HOME}/elrondsdk/vmtools:${env:HOME}/elrondsdk/nodejs/latest/bin:${env:PATH}",
|
"PATH": "${env:HOME}/elrondsdk/vendor-rust/bin:${env:HOME}/elrondsdk/erdpy-venv/bin:${env:HOME}/elrondsdk/vmtools:${env:HOME}/elrondsdk/nodejs/latest/bin:${env:PATH}",
|
||||||
"VIRTUAL_ENV": "${env:HOME}/elrondsdk/erdpy-venv",
|
"VIRTUAL_ENV": "${env:HOME}/elrondsdk/erdpy-venv",
|
||||||
|
24
package-lock.json
generated
24
package-lock.json
generated
@ -42,7 +42,8 @@
|
|||||||
"@types/react": "^18.0.27",
|
"@types/react": "^18.0.27",
|
||||||
"@types/react-dom": "^18.0.10",
|
"@types/react-dom": "^18.0.10",
|
||||||
"@types/uuid": "^9.0.0",
|
"@types/uuid": "^9.0.0",
|
||||||
"nodemon": "^2.0.20"
|
"nodemon": "^2.0.20",
|
||||||
|
"prettier": "2.8.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@cspotcode/source-map-support": {
|
"node_modules/@cspotcode/source-map-support": {
|
||||||
@ -1439,6 +1440,21 @@
|
|||||||
"node": "^10 || ^12 || >=14"
|
"node": "^10 || ^12 || >=14"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/prettier": {
|
||||||
|
"version": "2.8.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.4.tgz",
|
||||||
|
"integrity": "sha512-vIS4Rlc2FNh0BySk3Wkd6xmwxB0FpOndW5fisM5H8hsZSxU2VWVB5CWIkIjWvrHjIhxk2g3bfMKM87zNTrZddw==",
|
||||||
|
"dev": true,
|
||||||
|
"bin": {
|
||||||
|
"prettier": "bin-prettier.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10.13.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/prettier/prettier?sponsor=1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/prisma": {
|
"node_modules/prisma": {
|
||||||
"version": "4.9.0",
|
"version": "4.9.0",
|
||||||
"resolved": "https://registry.npmjs.org/prisma/-/prisma-4.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/prisma/-/prisma-4.9.0.tgz",
|
||||||
@ -3437,6 +3453,12 @@
|
|||||||
"source-map-js": "^1.0.2"
|
"source-map-js": "^1.0.2"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"prettier": {
|
||||||
|
"version": "2.8.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.4.tgz",
|
||||||
|
"integrity": "sha512-vIS4Rlc2FNh0BySk3Wkd6xmwxB0FpOndW5fisM5H8hsZSxU2VWVB5CWIkIjWvrHjIhxk2g3bfMKM87zNTrZddw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"prisma": {
|
"prisma": {
|
||||||
"version": "4.9.0",
|
"version": "4.9.0",
|
||||||
"resolved": "https://registry.npmjs.org/prisma/-/prisma-4.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/prisma/-/prisma-4.9.0.tgz",
|
||||||
|
@ -74,7 +74,8 @@
|
|||||||
"@types/react": "^18.0.27",
|
"@types/react": "^18.0.27",
|
||||||
"@types/react-dom": "^18.0.10",
|
"@types/react-dom": "^18.0.10",
|
||||||
"@types/uuid": "^9.0.0",
|
"@types/uuid": "^9.0.0",
|
||||||
"nodemon": "^2.0.20"
|
"nodemon": "^2.0.20",
|
||||||
|
"prettier": "2.8.4"
|
||||||
},
|
},
|
||||||
"prisma": {
|
"prisma": {
|
||||||
"schema": "src/common/databases/schema.prisma"
|
"schema": "src/common/databases/schema.prisma"
|
||||||
|
@ -7,7 +7,7 @@ module.exports = {
|
|||||||
useTabs: true,
|
useTabs: true,
|
||||||
singleQuote: false,
|
singleQuote: false,
|
||||||
trailingComma: "all",
|
trailingComma: "all",
|
||||||
printWidth: 240,
|
printWidth: 140,
|
||||||
semi: true,
|
semi: true,
|
||||||
bracketSameLine: true,
|
bracketSameLine: true,
|
||||||
},
|
},
|
||||||
|
@ -61,4 +61,3 @@ export default class ProjectController extends ApiController {
|
|||||||
this.httpCreated(res, await this.projectService.create(projectEntity));
|
this.httpCreated(res, await this.projectService.create(projectEntity));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -4,5 +4,5 @@ import ProjectController from "./ProjectController";
|
|||||||
export default {
|
export default {
|
||||||
start: () => {
|
start: () => {
|
||||||
Container.get(ProjectController);
|
Container.get(ProjectController);
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
|
@ -22,4 +22,3 @@ export default function errorHandler(error: any, req: Request, response: Respons
|
|||||||
|
|
||||||
next(error);
|
next(error);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -26,4 +26,3 @@ export default class TezosLink {
|
|||||||
return name;
|
return name;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -187,4 +187,3 @@ export default class MetricRepository {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -31,7 +31,6 @@ export default class ProjectRepository {
|
|||||||
_count: {
|
_count: {
|
||||||
select: { Metrics: true },
|
select: { Metrics: true },
|
||||||
},
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@ -59,4 +58,3 @@ export default class ProjectRepository {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -5,22 +5,22 @@ export default class MetricEntity {
|
|||||||
@IsNotEmpty()
|
@IsNotEmpty()
|
||||||
public id!: number;
|
public id!: number;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public path!: string;
|
public path!: string;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public uuid!: string;
|
public uuid!: string;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public remote_address!: string;
|
public remote_address!: string;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public date_requested!: Date;
|
public date_requested!: Date;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public projectId!: number;
|
public projectId!: number;
|
||||||
|
|
||||||
@IsNotEmpty(({groups: ["create"]}))
|
@IsNotEmpty({ groups: ["create"] })
|
||||||
public project!: ProjectEntity;
|
public project!: ProjectEntity;
|
||||||
|
|
||||||
@IsDate()
|
@IsDate()
|
||||||
|
@ -1,2 +1 @@
|
|||||||
export default class BaseService {}
|
export default class BaseService {}
|
||||||
|
|
||||||
|
@ -85,4 +85,3 @@ export default class MetricService {
|
|||||||
await this.metricRepository.removeOldMetricsBymonths(months);
|
await this.metricRepository.removeOldMetricsBymonths(months);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -4,8 +4,6 @@ import { ProjectEntity } from "@Common/ressources";
|
|||||||
import { type processFindManyQuery } from "prisma-query";
|
import { type processFindManyQuery } from "prisma-query";
|
||||||
import { Service } from "typedi";
|
import { Service } from "typedi";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@Service()
|
@Service()
|
||||||
export default class ProjectService {
|
export default class ProjectService {
|
||||||
constructor(private projectRepository: ProjectRepository) {}
|
constructor(private projectRepository: ProjectRepository) {}
|
||||||
@ -36,4 +34,3 @@ export default class ProjectService {
|
|||||||
return ObjectHydrate.hydrate<Partial<ProjectEntity>>(new ProjectEntity(), project);
|
return ObjectHydrate.hydrate<Partial<ProjectEntity>>(new ProjectEntity(), project);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -31,4 +31,3 @@ export default class ExpressServer implements ServerInterface {
|
|||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -14,4 +14,3 @@ export default interface ServerInterface {
|
|||||||
|
|
||||||
init(config: IConfig): this;
|
init(config: IConfig): this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6,4 +6,3 @@ import HttpCodes from "@Common/system/controller-pattern/HttpCodes";
|
|||||||
export default abstract class ApiController extends BaseController {}
|
export default abstract class ApiController extends BaseController {}
|
||||||
|
|
||||||
export { HttpCodes as ResponseStatusCodes };
|
export { HttpCodes as ResponseStatusCodes };
|
||||||
|
|
||||||
|
@ -2,10 +2,8 @@ import { StRoute } from "./StRoute";
|
|||||||
import { Response } from "express";
|
import { Response } from "express";
|
||||||
import HttpCodes from "@Common/system/controller-pattern/HttpCodes";
|
import HttpCodes from "@Common/system/controller-pattern/HttpCodes";
|
||||||
|
|
||||||
|
|
||||||
type IResponseData = {} | string | number | boolean | null | unknown;
|
type IResponseData = {} | string | number | boolean | null | unknown;
|
||||||
|
|
||||||
|
|
||||||
export default abstract class BaseController {
|
export default abstract class BaseController {
|
||||||
public expressRoutes!: StRoute[];
|
public expressRoutes!: StRoute[];
|
||||||
public httpCode: typeof HttpCodes = HttpCodes;
|
public httpCode: typeof HttpCodes = HttpCodes;
|
||||||
|
@ -34,4 +34,3 @@ function createRoute(controller: any, route: StRoute) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default Controller;
|
export default Controller;
|
||||||
|
|
||||||
|
@ -12,4 +12,3 @@ export default class ErrorCatch {
|
|||||||
next(args[args.length - 1] ?? "Unknown Error");
|
next(args[args.length - 1] ?? "Unknown Error");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,7 +1,12 @@
|
|||||||
import BaseController from "./BaseController";
|
import BaseController from "./BaseController";
|
||||||
import { StRoute } from "./StRoute";
|
import { StRoute } from "./StRoute";
|
||||||
|
|
||||||
function MethodsAny(type: StRoute["type"], path: string, frontMiddlewares: StRoute["frontMiddlewares"] = [], backMiddlewares: StRoute["backMiddlewares"] = []) {
|
function MethodsAny(
|
||||||
|
type: StRoute["type"],
|
||||||
|
path: string,
|
||||||
|
frontMiddlewares: StRoute["frontMiddlewares"] = [],
|
||||||
|
backMiddlewares: StRoute["backMiddlewares"] = [],
|
||||||
|
) {
|
||||||
return (target: any, memberName: string, propertyDescriptor: PropertyDescriptor) => {
|
return (target: any, memberName: string, propertyDescriptor: PropertyDescriptor) => {
|
||||||
const func = propertyDescriptor.value;
|
const func = propertyDescriptor.value;
|
||||||
const constructor: typeof BaseController = target.constructor;
|
const constructor: typeof BaseController = target.constructor;
|
||||||
@ -29,4 +34,3 @@ export const Delete = MethodsAny.bind(null, "delete");
|
|||||||
* @description Decorator Method PUT
|
* @description Decorator Method PUT
|
||||||
*/
|
*/
|
||||||
export const Put = MethodsAny.bind(null, "put");
|
export const Put = MethodsAny.bind(null, "put");
|
||||||
|
|
||||||
|
@ -7,4 +7,3 @@ export interface StRoute {
|
|||||||
frontMiddlewares: ((requests: Request, response: Response, next: NextFunction) => void)[];
|
frontMiddlewares: ((requests: Request, response: Response, next: NextFunction) => void)[];
|
||||||
backMiddlewares: ((requests: Request, response: Response, next: NextFunction) => void)[];
|
backMiddlewares: ((requests: Request, response: Response, next: NextFunction) => void)[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -13,8 +13,7 @@ export default class DbProvider {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
constructor(protected config: IDatabaseConfig) {
|
constructor(protected config: IDatabaseConfig) {}
|
||||||
}
|
|
||||||
|
|
||||||
public async connect(): Promise<void> {
|
public async connect(): Promise<void> {
|
||||||
await this.client.$connect();
|
await this.client.$connect();
|
||||||
|
@ -22,15 +22,8 @@ Container.get(ExpressServer).init({
|
|||||||
label,
|
label,
|
||||||
port: parseInt(port),
|
port: parseInt(port),
|
||||||
rootUrl,
|
rootUrl,
|
||||||
middlwares: [
|
middlwares: [cors({ origin: "*" }), bodyParser.urlencoded({ extended: true }), bodyParser.json()],
|
||||||
cors({ origin: "*" }),
|
|
||||||
bodyParser.urlencoded({ extended: true }),
|
|
||||||
bodyParser.json(),
|
|
||||||
],
|
|
||||||
errorHandler,
|
errorHandler,
|
||||||
});
|
});
|
||||||
|
|
||||||
routes.start();
|
routes.start();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -15,7 +15,7 @@ if (!rootUrl) throw new Error(`process.env RootUrl is undefined`);
|
|||||||
|
|
||||||
Container.get(NextServer).init({
|
Container.get(NextServer).init({
|
||||||
label,
|
label,
|
||||||
isDev: process.env.NODE_ENV !== 'production',
|
isDev: process.env.NODE_ENV !== "production",
|
||||||
port: parseInt(port),
|
port: parseInt(port),
|
||||||
rootUrl,
|
rootUrl,
|
||||||
});
|
});
|
@ -1,13 +1,16 @@
|
|||||||
|
|
||||||
export enum ContentType {
|
export enum ContentType {
|
||||||
JSON = "application/json",
|
JSON = "application/json",
|
||||||
FORM_DATA = "multipart/form-data;",
|
FORM_DATA = "multipart/form-data;",
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
export default abstract class BaseApiService {
|
export default abstract class BaseApiService {
|
||||||
protected readonly backUrl = process.env["NEXT_PUBLIC_API_HOSTNAME"] + ':' + process.env['NEXT_PUBLIC_API_PORT'] + process.env['NEXT_PUBLIC_API_ROOT_URL'];
|
protected readonly backUrl =
|
||||||
protected readonly proxyUrl = process.env["NEXT_PUBLIC_RPC_GATEWAY_HOSTNAME"] + ':' + process.env['NEXT_PUBLIC_RPC_GATEWAY_PORT'] + process.env['NEXT_PUBLIC_RPC_GATEWAY_ROOT_URL'];
|
process.env["NEXT_PUBLIC_API_HOSTNAME"] + ":" + process.env["NEXT_PUBLIC_API_PORT"] + process.env["NEXT_PUBLIC_API_ROOT_URL"];
|
||||||
|
protected readonly proxyUrl =
|
||||||
|
process.env["NEXT_PUBLIC_RPC_GATEWAY_HOSTNAME"] +
|
||||||
|
":" +
|
||||||
|
process.env["NEXT_PUBLIC_RPC_GATEWAY_PORT"] +
|
||||||
|
process.env["NEXT_PUBLIC_RPC_GATEWAY_ROOT_URL"];
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
||||||
protected constructor() {}
|
protected constructor() {}
|
||||||
@ -114,7 +117,6 @@ export default abstract class BaseApiService {
|
|||||||
protected onError(error: unknown) {
|
protected onError(error: unknown) {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface IResponse {
|
export interface IResponse {
|
||||||
|
@ -1,15 +1,15 @@
|
|||||||
import BaseApiService from "src/front/Api/BaseApiService"
|
import BaseApiService from "src/front/Api/BaseApiService";
|
||||||
import { IProject } from "src/front/interfaces"
|
import { IProject } from "src/front/interfaces";
|
||||||
import { Service } from "typedi";
|
import { Service } from "typedi";
|
||||||
|
|
||||||
type IPostProject = {
|
type IPostProject = {
|
||||||
title: string,
|
title: string;
|
||||||
network: string
|
network: string;
|
||||||
}
|
};
|
||||||
@Service()
|
@Service()
|
||||||
export default class Project extends BaseApiService {
|
export default class Project extends BaseApiService {
|
||||||
private static instance: Project;
|
private static instance: Project;
|
||||||
private readonly baseURl = this.backUrl.concat('/projects');
|
private readonly baseURl = this.backUrl.concat("/projects");
|
||||||
|
|
||||||
private constructor() {
|
private constructor() {
|
||||||
super();
|
super();
|
||||||
@ -34,7 +34,7 @@ export default class Project extends BaseApiService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
public async getOneProject(uuid: string): Promise<IProject> {
|
public async getOneProject(uuid: string): Promise<IProject> {
|
||||||
const url = new URL(this.baseURl.concat('/').concat(uuid));
|
const url = new URL(this.baseURl.concat("/").concat(uuid));
|
||||||
try {
|
try {
|
||||||
return await this.getRequest<IProject>(url);
|
return await this.getRequest<IProject>(url);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
|
@ -36,12 +36,7 @@ export default class Button extends React.Component<IProps, IState> {
|
|||||||
// let icon = this.props.isloading === "true" ? <Loader /> : this.props.icon; // Notion de loader
|
// let icon = this.props.isloading === "true" ? <Loader /> : this.props.icon; // Notion de loader
|
||||||
let icon = this.props.icon;
|
let icon = this.props.icon;
|
||||||
return (
|
return (
|
||||||
<button
|
<button {...attributes} onClick={this.props.onClick} className={classes["root"]} type={this.props.type}>
|
||||||
{...attributes}
|
|
||||||
onClick={this.props.onClick}
|
|
||||||
className={classes["root"]}
|
|
||||||
type={this.props.type}
|
|
||||||
>
|
|
||||||
{this.props.children}
|
{this.props.children}
|
||||||
{this.props.icon && icon}
|
{this.props.icon && icon}
|
||||||
</button>
|
</button>
|
||||||
|
@ -35,5 +35,4 @@
|
|||||||
.tooltip {
|
.tooltip {
|
||||||
margin-left: 16px;
|
margin-left: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -17,10 +17,7 @@ export default class CheckBox extends React.Component<IProps> {
|
|||||||
return (
|
return (
|
||||||
<Typography typo={ITypo.P_ERR_16} color={ITypoColor.BLACK}>
|
<Typography typo={ITypo.P_ERR_16} color={ITypoColor.BLACK}>
|
||||||
<label className={classes["root"]}>
|
<label className={classes["root"]}>
|
||||||
<input
|
<input type="checkbox" name={this.props.name} />
|
||||||
type="checkbox"
|
|
||||||
name={this.props.name}
|
|
||||||
/>
|
|
||||||
{this.props.name}
|
{this.props.name}
|
||||||
{this.props.toolTip && <Tooltip className={classes["tooltip"]} text={this.props.toolTip} />}
|
{this.props.toolTip && <Tooltip className={classes["tooltip"]} text={this.props.toolTip} />}
|
||||||
</label>
|
</label>
|
||||||
|
@ -43,7 +43,9 @@ export default class InputField extends BaseField<IProps> {
|
|||||||
value={value}
|
value={value}
|
||||||
onChange={this.onChange}
|
onChange={this.onChange}
|
||||||
data-has-validation-errors={this.state.errors.length > 0}
|
data-has-validation-errors={this.state.errors.length > 0}
|
||||||
className={this.props.className ? [classes["textarea"], classes[this.props.className]].join(" ") : classes["textarea"]}
|
className={
|
||||||
|
this.props.className ? [classes["textarea"], classes[this.props.className]].join(" ") : classes["textarea"]
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
<div className={classes["fake-placeholder"]}>{this.props.fakeplaceholder}</div>
|
<div className={classes["fake-placeholder"]}>{this.props.fakeplaceholder}</div>
|
||||||
</div>
|
</div>
|
||||||
@ -61,7 +63,9 @@ export default class InputField extends BaseField<IProps> {
|
|||||||
onBlur={this.onBlur}
|
onBlur={this.onBlur}
|
||||||
value={value}
|
value={value}
|
||||||
data-has-validation-errors={this.state.errors.length > 0}
|
data-has-validation-errors={this.state.errors.length > 0}
|
||||||
className={this.props.className ? [classes["input"], classes[this.props.className]].join(" ") : classes["input"]}
|
className={
|
||||||
|
this.props.className ? [classes["input"], classes[this.props.className]].join(" ") : classes["input"]
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
<div className={classes["fake-placeholder"]}>{this.props.fakeplaceholder}</div>
|
<div className={classes["fake-placeholder"]}>{this.props.fakeplaceholder}</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -4,7 +4,7 @@ import Link from "next/link";
|
|||||||
import Typography, { ITypo } from "../../Typography";
|
import Typography, { ITypo } from "../../Typography";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
import router from "next/router";
|
import router from "next/router";
|
||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
type IPropsClass = {
|
type IPropsClass = {
|
||||||
text: string | JSX.Element;
|
text: string | JSX.Element;
|
||||||
@ -16,21 +16,20 @@ type IStateClass = {};
|
|||||||
|
|
||||||
class HeaderLinkClass extends React.Component<IPropsClass, IStateClass> {
|
class HeaderLinkClass extends React.Component<IPropsClass, IStateClass> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <Link href={this.props.path ?? ""} className={classNames(classes["root"], this.props.isActive && [classes["active"]])}
|
return (
|
||||||
>
|
<Link href={this.props.path ?? ""} className={classNames(classes["root"], this.props.isActive && [classes["active"]])}>
|
||||||
<div className={classes["content"]}>
|
<div className={classes["content"]}>
|
||||||
<Typography typo={ITypo.NAV_HEADER_18}>
|
<Typography typo={ITypo.NAV_HEADER_18}>{this.props.text}</Typography>
|
||||||
{this.props.text}
|
|
||||||
</Typography>
|
|
||||||
</div>
|
</div>
|
||||||
{this.props.isActive && <div className={classes["underline"]} />}
|
{this.props.isActive && <div className={classes["underline"]} />}
|
||||||
</Link>;
|
</Link>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function HeaderLink(props: IPropsClass) {
|
export default function HeaderLink(props: IPropsClass) {
|
||||||
const [url, setUrl] = useState("")
|
const [url, setUrl] = useState("");
|
||||||
useEffect(() => setUrl(router?.asPath), [])
|
useEffect(() => setUrl(router?.asPath), []);
|
||||||
const isActive = url === props.path;
|
const isActive = url === props.path;
|
||||||
return <HeaderLinkClass {...props} isActive={isActive} />;
|
return <HeaderLinkClass {...props} isActive={isActive} />;
|
||||||
}
|
}
|
||||||
|
@ -7,12 +7,14 @@ type IState = {};
|
|||||||
|
|
||||||
export default class Navigation extends React.Component<IProps, IState> {
|
export default class Navigation extends React.Component<IProps, IState> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <div className={classes["root"]}>
|
return (
|
||||||
|
<div className={classes["root"]}>
|
||||||
<HeaderLink text={"Home"} path={"/"} />
|
<HeaderLink text={"Home"} path={"/"} />
|
||||||
<HeaderLink text={"Design system"} path={"/design-system"} />
|
<HeaderLink text={"Design system"} path={"/design-system"} />
|
||||||
<HeaderLink text={"Ancrage"} path={""} />
|
<HeaderLink text={"Ancrage"} path={""} />
|
||||||
<HeaderLink text={"Collaborateurs"} path={""} />
|
<HeaderLink text={"Collaborateurs"} path={""} />
|
||||||
<HeaderLink text={"Paramétrage des listes de pièces"} path={""} />
|
<HeaderLink text={"Paramétrage des listes de pièces"} path={""} />
|
||||||
</div>;
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -27,30 +27,31 @@ export default class NotificationModal extends React.Component<IProps, IState> {
|
|||||||
|
|
||||||
public override render(): JSX.Element | null {
|
public override render(): JSX.Element | null {
|
||||||
if (!this.props.isOpen) return null;
|
if (!this.props.isOpen) return null;
|
||||||
return <>
|
return (
|
||||||
|
<>
|
||||||
<div className={classes["background"]} onClick={this.props.closeModal} />
|
<div className={classes["background"]} onClick={this.props.closeModal} />
|
||||||
<div className={classes["root"]}>
|
<div className={classes["root"]}>
|
||||||
<div className={classes["notification-header"]}>
|
<div className={classes["notification-header"]}>
|
||||||
<Typography typo={ITypo.P_16}>
|
<Typography typo={ITypo.P_16}>Notifications</Typography>
|
||||||
Notifications
|
|
||||||
</Typography>
|
|
||||||
<div className={classes["close-icon"]} onClick={this.props.closeModal}>
|
<div className={classes["close-icon"]} onClick={this.props.closeModal}>
|
||||||
<Image src={CloseIcon} alt="Close notification modal" className={classes["close-icon"]}></Image>
|
<Image src={CloseIcon} alt="Close notification modal" className={classes["close-icon"]}></Image>
|
||||||
</div>
|
</div>
|
||||||
</div>;
|
</div>
|
||||||
|
;
|
||||||
<div className={classes["notification-body"]}>
|
<div className={classes["notification-body"]}>
|
||||||
<>
|
<>
|
||||||
{Toasts.getInstance().toasts.length === 0
|
{Toasts.getInstance().toasts.length === 0 ? (
|
||||||
?
|
|
||||||
<div>
|
<div>
|
||||||
<Typography typo={ITypo.P_16}>No notification yet</Typography>
|
<Typography typo={ITypo.P_16}>No notification yet</Typography>
|
||||||
</div>
|
</div>
|
||||||
: <ToastHandler />}
|
) : (
|
||||||
|
<ToastHandler />
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
public override componentDidMount() {
|
public override componentDidMount() {
|
||||||
|
@ -26,20 +26,21 @@ export default class Notifications extends React.Component<IProps, IState> {
|
|||||||
this.openModal = this.openModal.bind(this);
|
this.openModal = this.openModal.bind(this);
|
||||||
this.closeModal = this.closeModal.bind(this);
|
this.closeModal = this.closeModal.bind(this);
|
||||||
this.handleToastChange = this.handleToastChange.bind(this);
|
this.handleToastChange = this.handleToastChange.bind(this);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <div className={classes["root"]}>
|
return (
|
||||||
|
<div className={classes["root"]}>
|
||||||
<div className={classes["icon-container"]} onClick={this.openModal}>
|
<div className={classes["icon-container"]} onClick={this.openModal}>
|
||||||
<Image alt="notifications" src={NotificationIcon} className={classes["notification-icon"]} />
|
<Image alt="notifications" src={NotificationIcon} className={classes["notification-icon"]} />
|
||||||
{this.state.hasNotifications &&
|
{this.state.hasNotifications && (
|
||||||
<Image className={classes["notification-dot"]} src={InfoIcon} alt="Unread notification" />
|
<Image className={classes["notification-dot"]} src={InfoIcon} alt="Unread notification" />
|
||||||
}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{this.state.isModalOpen && <NotificationModal isOpen={this.state.isModalOpen} closeModal={this.closeModal} />}
|
{this.state.isModalOpen && <NotificationModal isOpen={this.state.isModalOpen} closeModal={this.closeModal} />}
|
||||||
</div>;
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
public override componentDidMount() {
|
public override componentDidMount() {
|
||||||
@ -53,15 +54,15 @@ export default class Notifications extends React.Component<IProps, IState> {
|
|||||||
private handleToastChange(toastList: IToast[] | null) {
|
private handleToastChange(toastList: IToast[] | null) {
|
||||||
this.setState({
|
this.setState({
|
||||||
toastList,
|
toastList,
|
||||||
hasNotifications: toastList ? toastList.length > 0 : false
|
hasNotifications: toastList ? toastList.length > 0 : false,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
private openModal() {
|
private openModal() {
|
||||||
this.setState({ isModalOpen: true });
|
this.setState({ isModalOpen: true });
|
||||||
};
|
}
|
||||||
|
|
||||||
private closeModal() {
|
private closeModal() {
|
||||||
this.setState({ isModalOpen: false });
|
this.setState({ isModalOpen: false });
|
||||||
};
|
}
|
||||||
}
|
}
|
@ -10,7 +10,6 @@ type IState = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export default class Profile extends React.Component<IProps, IState> {
|
export default class Profile extends React.Component<IProps, IState> {
|
||||||
|
|
||||||
constructor(props: IProps) {
|
constructor(props: IProps) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
@ -18,21 +17,22 @@ export default class Profile extends React.Component<IProps, IState> {
|
|||||||
};
|
};
|
||||||
this.openModal = this.openModal.bind(this);
|
this.openModal = this.openModal.bind(this);
|
||||||
this.closeModal = this.closeModal.bind(this);
|
this.closeModal = this.closeModal.bind(this);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <div className={classes["root"]}>
|
return (
|
||||||
|
<div className={classes["root"]}>
|
||||||
<Image alt="profile" src={ProfileIcon} className={classes["profile-icon"]} onClick={this.openModal} />
|
<Image alt="profile" src={ProfileIcon} className={classes["profile-icon"]} onClick={this.openModal} />
|
||||||
{this.state.isModalOpen && <ProfileModal isOpen={this.state.isModalOpen} closeModal={this.closeModal} />}
|
{this.state.isModalOpen && <ProfileModal isOpen={this.state.isModalOpen} closeModal={this.closeModal} />}
|
||||||
</div>;
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
private openModal() {
|
private openModal() {
|
||||||
this.setState({ isModalOpen: true });
|
this.setState({ isModalOpen: true });
|
||||||
};
|
}
|
||||||
|
|
||||||
private closeModal() {
|
private closeModal() {
|
||||||
this.setState({ isModalOpen: false });
|
this.setState({ isModalOpen: false });
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import classes from "./classes.module.scss";
|
import classes from "./classes.module.scss";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import LogoIcon from "@Assets/logo.svg"
|
import LogoIcon from "@Assets/logo.svg";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import Navigation from "./Navigation";
|
import Navigation from "./Navigation";
|
||||||
import Notifications from "./Notifications";
|
import Notifications from "./Notifications";
|
||||||
@ -12,7 +12,8 @@ type IState = {};
|
|||||||
|
|
||||||
export default class Header extends React.Component<IProps, IState> {
|
export default class Header extends React.Component<IProps, IState> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <div className={classes["root"]}>
|
return (
|
||||||
|
<div className={classes["root"]}>
|
||||||
<div className={classes["logo-container"]}>
|
<div className={classes["logo-container"]}>
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
<Image src={LogoIcon} alt="logo" className={classes["logo"]} />
|
<Image src={LogoIcon} alt="logo" className={classes["logo"]} />
|
||||||
@ -23,6 +24,7 @@ export default class Header extends React.Component<IProps, IState> {
|
|||||||
<Notifications />
|
<Notifications />
|
||||||
<Profile />
|
<Profile />
|
||||||
</div>
|
</div>
|
||||||
</div>;
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -8,7 +8,7 @@ interface IProps {
|
|||||||
|
|
||||||
export default class Loader extends React.Component<IProps> {
|
export default class Loader extends React.Component<IProps> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <img src={LoaderIcon} className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} />
|
return <img src={LoaderIcon} className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} />;
|
||||||
// <LoaderIcon className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} />;
|
// <LoaderIcon className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} />;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -49,10 +49,7 @@ export default class Confirm extends Modal<IProps, IState> {
|
|||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<Button
|
<Button variant={EButtonVariant.PRIMARY} onClick={this.props.onAccept} disabled={this.props.isConfirmButtonDisabled}>
|
||||||
variant={EButtonVariant.PRIMARY}
|
|
||||||
onClick={this.props.onAccept}
|
|
||||||
disabled={this.props.isConfirmButtonDisabled}>
|
|
||||||
{this.props.confirmText}
|
{this.props.confirmText}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -10,4 +10,3 @@
|
|||||||
color: var(--color-neutral-900);
|
color: var(--color-neutral-900);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -10,9 +10,7 @@ export default class Header extends React.Component<IProps> {
|
|||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<header className={classes["root"]}>
|
<header className={classes["root"]}>
|
||||||
<Typography typo={ITypo.H2}>
|
<Typography typo={ITypo.H2}>{this.props.content}</Typography>
|
||||||
{this.props.content}
|
|
||||||
</Typography>
|
|
||||||
</header>
|
</header>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -13,9 +13,7 @@ export default class PopUpLoader extends React.Component<IProps> {
|
|||||||
<div className={classes["root"]}>
|
<div className={classes["root"]}>
|
||||||
{/* <Loader /> */}
|
{/* <Loader /> */}
|
||||||
TODO: INTEGRER LOARDER ISLOADING
|
TODO: INTEGRER LOARDER ISLOADING
|
||||||
<Typography typo={ITypo.P_16}>
|
<Typography typo={ITypo.P_16}>{this.props.text && this.props.text}</Typography>
|
||||||
{this.props.text && this.props.text}
|
|
||||||
</Typography>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -5,7 +5,7 @@ import Header from "./Elements/Header";
|
|||||||
|
|
||||||
import Loader from "./Elements/Loader";
|
import Loader from "./Elements/Loader";
|
||||||
import Typography, { ITypo } from "../Typography";
|
import Typography, { ITypo } from "../Typography";
|
||||||
import CrossIcon from "@Assets/icons/cross.svg"
|
import CrossIcon from "@Assets/icons/cross.svg";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
|
||||||
export type IModalProps = {
|
export type IModalProps = {
|
||||||
@ -53,9 +53,7 @@ export default class Modal<P extends IModalProps, S extends IState = IState> ext
|
|||||||
{this.props.header && <Header content={this.props.header} />}
|
{this.props.header && <Header content={this.props.header} />}
|
||||||
|
|
||||||
<Typography typo={ITypo.P_16}>
|
<Typography typo={ITypo.P_16}>
|
||||||
<>
|
<>{this.props.children ? this.props.children : <Loader text={this.props.textLoader} />}</>
|
||||||
{this.props.children ? this.props.children : <Loader text={this.props.textLoader} />}
|
|
||||||
</>
|
|
||||||
</Typography>
|
</Typography>
|
||||||
{this.props.children && this.props.footer && <Footer content={this.props.footer} />}
|
{this.props.children && this.props.footer && <Footer content={this.props.footer} />}
|
||||||
</div>
|
</div>
|
||||||
|
@ -10,15 +10,11 @@ children: React.ReactNode;
|
|||||||
};
|
};
|
||||||
|
|
||||||
export default class RadioBox extends React.Component<IProps> {
|
export default class RadioBox extends React.Component<IProps> {
|
||||||
|
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<Typography typo={ITypo.P_ERR_16} color={ITypoColor.BLACK}>
|
<Typography typo={ITypo.P_ERR_16} color={ITypoColor.BLACK}>
|
||||||
<label className={classes["root"]}>
|
<label className={classes["root"]}>
|
||||||
<input
|
<input type="radio" name={this.props.name} />
|
||||||
type="radio"
|
|
||||||
name={this.props.name}
|
|
||||||
/>
|
|
||||||
{this.props.children}
|
{this.props.children}
|
||||||
{this.props.toolTip && <Tooltip className={classes["tooltip"]} text={this.props.toolTip} />}
|
{this.props.toolTip && <Tooltip className={classes["tooltip"]} text={this.props.toolTip} />}
|
||||||
</label>
|
</label>
|
||||||
|
@ -62,11 +62,7 @@ export default class ToastElement extends React.Component<IProps, IState> {
|
|||||||
|
|
||||||
private getToastTitle(title: string | React.ReactNode) {
|
private getToastTitle(title: string | React.ReactNode) {
|
||||||
if (typeof title === "string") {
|
if (typeof title === "string") {
|
||||||
return (
|
return <Typography typo={ITypo.P_16}>{title}</Typography>;
|
||||||
<Typography typo={ITypo.P_16}>
|
|
||||||
{title}
|
|
||||||
</Typography>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
return title;
|
return title;
|
||||||
}
|
}
|
||||||
|
@ -6,8 +6,6 @@ type IState = {};
|
|||||||
|
|
||||||
export default class ToastHandler extends React.Component<IProps, IState> {
|
export default class ToastHandler extends React.Component<IProps, IState> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return (
|
return <ToastsContainer />;
|
||||||
<ToastsContainer />
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -3,7 +3,7 @@
|
|||||||
|
|
||||||
.root {
|
.root {
|
||||||
color: $black;
|
color: $black;
|
||||||
font-family: 'Inter', sans-serif;
|
font-family: "Inter", sans-serif;
|
||||||
&.H1-60 {
|
&.H1-60 {
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
@ -93,7 +93,7 @@
|
|||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
letter-spacing: 0.005em
|
letter-spacing: 0.005em;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.Paragraphe-16-error {
|
&.Paragraphe-16-error {
|
||||||
|
@ -32,19 +32,13 @@ export enum ITypo {
|
|||||||
export enum ITypoColor {
|
export enum ITypoColor {
|
||||||
RE_HOVER = "re-hover",
|
RE_HOVER = "re-hover",
|
||||||
GREY = "grey",
|
GREY = "grey",
|
||||||
BLACK = 'black'
|
BLACK = "black",
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class Typography extends React.Component<IProps, IState> {
|
export default class Typography extends React.Component<IProps, IState> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<div
|
<div className={classNames(classes["root"], classes[this.props.typo], classes[this.props.color ?? ""])}>
|
||||||
className={classNames(
|
|
||||||
classes["root"],
|
|
||||||
classes[this.props.typo],
|
|
||||||
classes[this.props.color ?? ""]
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{this.props.children}
|
{this.props.children}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -8,12 +8,12 @@ type IState = {};
|
|||||||
|
|
||||||
export default class Version extends React.Component<IProps, IState> {
|
export default class Version extends React.Component<IProps, IState> {
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <div className={classes["root"]}>
|
return (
|
||||||
|
<div className={classes["root"]}>
|
||||||
<Typography typo={ITypo.P_16} color={ITypoColor.GREY}>
|
<Typography typo={ITypo.P_16} color={ITypoColor.GREY}>
|
||||||
<div>
|
<div>{VersionFile.version}</div>
|
||||||
{VersionFile.version}
|
|
||||||
</div>
|
|
||||||
</Typography>
|
</Typography>
|
||||||
</div>;
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -4,13 +4,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
transform: translate3d(-8.000023662749896px, 2.000005915687474px, 0) rotate(-45.000133102968164deg) scaleX(0.4999985210781315)
|
transform: translate3d(-8.000023662749896px, 2.000005915687474px, 0) rotate(-45.000133102968164deg) scaleX(0.4999985210781315);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes BurgerTopBackward {
|
@keyframes BurgerTopBackward {
|
||||||
0% {
|
0% {
|
||||||
transform: translate3d(-8.000023662749896px, 2.000005915687474px, 0) rotate(-45.000133102968164deg) scaleX(0.4999985210781315)
|
transform: translate3d(-8.000023662749896px, 2.000005915687474px, 0) rotate(-45.000133102968164deg) scaleX(0.4999985210781315);
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
|
@ -1,9 +1,7 @@
|
|||||||
@import "@Themes/constants.scss";
|
@import "@Themes/constants.scss";
|
||||||
@import "./animation.scss";
|
@import "./animation.scss";
|
||||||
|
|
||||||
|
|
||||||
.root {
|
.root {
|
||||||
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 18px;
|
left: 18px;
|
||||||
top: 23px;
|
top: 23px;
|
||||||
@ -30,18 +28,16 @@
|
|||||||
background-color: $textColor;
|
background-color: $textColor;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.inner-top {
|
.inner-top {
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|
||||||
&.true {
|
&.true {
|
||||||
animation: BurgerTopForward 0.2s cubic-bezier(.43,1.89,.68,.28);
|
animation: BurgerTopForward 0.2s cubic-bezier(0.43, 1.89, 0.68, 0.28);
|
||||||
animation-fill-mode: forwards;
|
animation-fill-mode: forwards;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.false {
|
&.false {
|
||||||
animation: BurgerTopBackward 0.2s cubic-bezier(.43,1.89,.68,.28);
|
animation: BurgerTopBackward 0.2s cubic-bezier(0.43, 1.89, 0.68, 0.28);
|
||||||
animation-fill-mode: forwards;
|
animation-fill-mode: forwards;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -59,14 +55,13 @@
|
|||||||
bottom: 1px;
|
bottom: 1px;
|
||||||
|
|
||||||
&.true {
|
&.true {
|
||||||
animation: BurgerBottomForward 0.2s cubic-bezier(.43,1.89,.68,.28);
|
animation: BurgerBottomForward 0.2s cubic-bezier(0.43, 1.89, 0.68, 0.28);
|
||||||
animation-fill-mode: forwards;
|
animation-fill-mode: forwards;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.false {
|
&.false {
|
||||||
animation: BurgerBottomBackward 0.2s cubic-bezier(.43,1.89,.68,.28);
|
animation: BurgerBottomBackward 0.2s cubic-bezier(0.43, 1.89, 0.68, 0.28);
|
||||||
animation-fill-mode: forwards;
|
animation-fill-mode: forwards;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
@ -2,8 +2,8 @@ import classes from "./classes.module.scss";
|
|||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
|
||||||
type IProps = {
|
type IProps = {
|
||||||
state: boolean,
|
state: boolean;
|
||||||
callback: () => void
|
callback: () => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function Burger({ state, callback }: IProps) {
|
export default function Burger({ state, callback }: IProps) {
|
||||||
|
@ -58,13 +58,13 @@
|
|||||||
|
|
||||||
@keyframes zoomIn {
|
@keyframes zoomIn {
|
||||||
from {
|
from {
|
||||||
transform: scale(.2);
|
transform: scale(0.2);
|
||||||
opacity: 0
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
opacity: 1
|
opacity: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -108,7 +108,6 @@
|
|||||||
visibility: visible;
|
visibility: visible;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.errorMsg {
|
.errorMsg {
|
||||||
|
@ -1,21 +1,21 @@
|
|||||||
import React, { RefObject } from "react";
|
import React, { RefObject } from "react";
|
||||||
import classes from "./classes.module.scss";
|
import classes from "./classes.module.scss";
|
||||||
import classNames from "classnames"
|
import classNames from "classnames";
|
||||||
import Image from "next/image"
|
import Image from "next/image";
|
||||||
import ErrorIcon from "@Assets/icons/input-error.svg"
|
import ErrorIcon from "@Assets/icons/input-error.svg";
|
||||||
import SuccessIcon from "@Assets/icons/input-success.svg"
|
import SuccessIcon from "@Assets/icons/input-success.svg";
|
||||||
|
|
||||||
type IProps = {
|
type IProps = {
|
||||||
inputRef?: RefObject<HTMLInputElement>,
|
inputRef?: RefObject<HTMLInputElement>;
|
||||||
icon?: string,
|
icon?: string;
|
||||||
placeholder?: string,
|
placeholder?: string;
|
||||||
name?: string,
|
name?: string;
|
||||||
value?: string,
|
value?: string;
|
||||||
onChange: any,
|
onChange: any;
|
||||||
onBlur?: any,
|
onBlur?: any;
|
||||||
inputStatus: 'success' | 'error' | 'neutral',
|
inputStatus: "success" | "error" | "neutral";
|
||||||
errorMsg?: string
|
errorMsg?: string;
|
||||||
type: string
|
type: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default class InputField extends React.Component<IProps> {
|
export default class InputField extends React.Component<IProps> {
|
||||||
@ -23,10 +23,12 @@ export default class InputField extends React.Component<IProps> {
|
|||||||
super(props);
|
super(props);
|
||||||
}
|
}
|
||||||
public override render(): JSX.Element {
|
public override render(): JSX.Element {
|
||||||
return <>
|
return (
|
||||||
|
<>
|
||||||
<div className={classNames(classes["root"])}>
|
<div className={classNames(classes["root"])}>
|
||||||
{this.props.icon && <Image className={classes["icon"]} alt={this.props.icon} src={this.props.icon} />}
|
{this.props.icon && <Image className={classes["icon"]} alt={this.props.icon} src={this.props.icon} />}
|
||||||
<input className={classNames(classes["component"], classes[this.props.inputStatus])}
|
<input
|
||||||
|
className={classNames(classes["component"], classes[this.props.inputStatus])}
|
||||||
ref={this.props.inputRef}
|
ref={this.props.inputRef}
|
||||||
type={this.props.type}
|
type={this.props.type}
|
||||||
name={this.props.name}
|
name={this.props.name}
|
||||||
@ -37,14 +39,12 @@ export default class InputField extends React.Component<IProps> {
|
|||||||
autoComplete={this.props.name}
|
autoComplete={this.props.name}
|
||||||
/>
|
/>
|
||||||
<div className={classNames(classes["status"], classes[this.props.inputStatus])}>
|
<div className={classNames(classes["status"], classes[this.props.inputStatus])}>
|
||||||
{this.props.inputStatus === "success" &&
|
{this.props.inputStatus === "success" && <Image alt="success icon" src={SuccessIcon} />}
|
||||||
<Image alt="success icon" src={SuccessIcon} />}
|
{this.props.inputStatus === "error" && <Image alt="error icon" src={ErrorIcon} />}
|
||||||
{this.props.inputStatus === "error" &&
|
|
||||||
<Image alt="error icon" src={ErrorIcon} />
|
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{this.props.errorMsg && <div className={classes["errorMsg"]}>{this.props.errorMsg}</div>}
|
{this.props.errorMsg && <div className={classes["errorMsg"]}>{this.props.errorMsg}</div>}
|
||||||
</>
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -1,5 +1,5 @@
|
|||||||
import Head from 'next/head';
|
import Head from "next/head";
|
||||||
import { ReactNode } from 'react';
|
import { ReactNode } from "react";
|
||||||
|
|
||||||
type DefaultLayoutProps = { children: ReactNode };
|
type DefaultLayoutProps = { children: ReactNode };
|
||||||
|
|
||||||
@ -14,4 +14,3 @@ export const DefaultLayout = ({ children }: DefaultLayoutProps) => {
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -27,7 +27,6 @@ export default class DefaultTemplate extends React.Component<IProps, IState> {
|
|||||||
</div>
|
</div>
|
||||||
<Version />
|
<Version />
|
||||||
</>
|
</>
|
||||||
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -11,23 +11,14 @@ export default class PageNotFound extends BasePage {
|
|||||||
{/* <Image alt="Unplugged" height="50" src={UnpluggedIcon} /> Oops */}
|
{/* <Image alt="Unplugged" height="50" src={UnpluggedIcon} /> Oops */}
|
||||||
<div className={classes["text"]}>There isn't anything here...</div>
|
<div className={classes["text"]}>There isn't anything here...</div>
|
||||||
<div className={classes["home-button"]}>
|
<div className={classes["home-button"]}>
|
||||||
<Link href="/">
|
<Link href="/">{/* <Button text="Go to Home" icon={CardsIcon} /> */}</Link>
|
||||||
{/* <Button text="Go to Home" icon={CardsIcon} /> */}
|
|
||||||
</Link>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<label>
|
<label>
|
||||||
<input />
|
<input />
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</DefaultTemplate>
|
</DefaultTemplate>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -38,12 +38,8 @@ export default class Header extends React.Component<IProps, IState> {
|
|||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes["button"]}>
|
<div className={classes["button"]}>
|
||||||
<Link href="/show-project">
|
<Link href="/show-project">{/* <Button color="transparent" text="MY PROJECT" icon={LoginIcon} /> */}</Link>
|
||||||
{/* <Button color="transparent" text="MY PROJECT" icon={LoginIcon} /> */}
|
<Link href="/new-project">{/* <Button text="CREATE" icon={PlusCardIcon} /> */}</Link>
|
||||||
</Link>
|
|
||||||
<Link href="/new-project">
|
|
||||||
{/* <Button text="CREATE" icon={PlusCardIcon} /> */}
|
|
||||||
</Link>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
@ -51,8 +47,6 @@ export default class Header extends React.Component<IProps, IState> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private switchStatus() {
|
private switchStatus() {
|
||||||
this.state.status
|
this.state.status ? this.setState({ status: false }) : this.setState({ status: true });
|
||||||
? this.setState({ status: false })
|
|
||||||
: this.setState({ status: true });
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,5 @@
|
|||||||
import EventEmitter from "@Front/Services/EventEmitter";
|
import EventEmitter from "@Front/Services/EventEmitter";
|
||||||
|
|
||||||
|
|
||||||
export default abstract class BaseStore {
|
export default abstract class BaseStore {
|
||||||
protected readonly event = new EventEmitter();
|
protected readonly event = new EventEmitter();
|
||||||
|
|
||||||
|
@ -5,8 +5,11 @@ Once sign up, a `Project ID` is generated for your project, to use within your a
|
|||||||
Then, add the tezoslink.net RPC endpoint to your prefered Tezos JS library.
|
Then, add the tezoslink.net RPC endpoint to your prefered Tezos JS library.
|
||||||
|
|
||||||
> i.e with [Sotez](https://github.com/AndrewKishino/sotez) :
|
> i.e with [Sotez](https://github.com/AndrewKishino/sotez) :
|
||||||
|
>
|
||||||
> ```js
|
> ```js
|
||||||
> const sotez = new Sotez('https://<NETWORK>.tezoslink.net/v1/<YOUR_PROJECT_ID>');
|
> const sotez = new Sotez(
|
||||||
|
> "https://<NETWORK>.tezoslink.net/v1/<YOUR_PROJECT_ID>"
|
||||||
|
> );
|
||||||
> ```
|
> ```
|
||||||
|
|
||||||
## Networks
|
## Networks
|
||||||
@ -14,7 +17,7 @@ Then, add the tezoslink.net RPC endpoint to your prefered Tezos JS library.
|
|||||||
Use one of these endpoints as your Tezos client provider.
|
Use one of these endpoints as your Tezos client provider.
|
||||||
|
|
||||||
| NETWORK | DESCRIPTION | URL |
|
| NETWORK | DESCRIPTION | URL |
|
||||||
|-------|-----------|-------------------------------------------------|
|
| ------- | ----------- | -------------------------------------------------- |
|
||||||
| Mainnet | JSON/RPC | https://mainnet.tezoslink.net/v1/<YOUR_PROJECT_ID> |
|
| Mainnet | JSON/RPC | https://mainnet.tezoslink.net/v1/<YOUR_PROJECT_ID> |
|
||||||
| Testnet | JSON/RPC | https://testnet.tezoslink.net/v1/<YOUR_PROJECT_ID> |
|
| Testnet | JSON/RPC | https://testnet.tezoslink.net/v1/<YOUR_PROJECT_ID> |
|
||||||
|
|
||||||
@ -38,6 +41,7 @@ The `Project ID` authorize requests.
|
|||||||
All requests of type `/chains/main/blocks(.*?)` are accepted.
|
All requests of type `/chains/main/blocks(.*?)` are accepted.
|
||||||
|
|
||||||
> Example of valid paths:
|
> Example of valid paths:
|
||||||
|
>
|
||||||
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/balance`
|
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/balance`
|
||||||
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/delegate`
|
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/delegate`
|
||||||
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/manager_key`
|
> - `/chains/main/blocks/head/context/contracts/<ADDRESS>/manager_key`
|
||||||
@ -52,11 +56,13 @@ All requests of type `/chains/main/blocks(.*?)` are accepted.
|
|||||||
## Nodes
|
## Nodes
|
||||||
|
|
||||||
Tezos has three types of nodes:
|
Tezos has three types of nodes:
|
||||||
|
|
||||||
- Full mode (default mode)
|
- Full mode (default mode)
|
||||||
- **Rolling mode**
|
- **Rolling mode**
|
||||||
- **Archive mode**
|
- **Archive mode**
|
||||||
|
|
||||||
We use two types of mode:
|
We use two types of mode:
|
||||||
|
|
||||||
- **Archive** to store the whole blockchain. Archive is the heaviest mode as it keeps the whole chain data to be able to query any information stored on the chain since the genesis. It is particularly suitable for indexers or block explorer, that is why we use archive nodes.
|
- **Archive** to store the whole blockchain. Archive is the heaviest mode as it keeps the whole chain data to be able to query any information stored on the chain since the genesis. It is particularly suitable for indexers or block explorer, that is why we use archive nodes.
|
||||||
- **Rolling** to store last blocks (and scale them faster)
|
- **Rolling** to store last blocks (and scale them faster)
|
||||||
|
|
||||||
|
@ -4,4 +4,3 @@
|
|||||||
- [Security](##security)
|
- [Security](##security)
|
||||||
- [RPC Endpoints](#rpc-endpoints)
|
- [RPC Endpoints](#rpc-endpoints)
|
||||||
- [Nodes](#nodes)
|
- [Nodes](#nodes)
|
||||||
|
|
||||||
|
@ -37,9 +37,11 @@ export default class DesignSystem extends BasePage<IProps, IState> {
|
|||||||
</div>
|
</div>
|
||||||
<div className={classes["sub-section"]}>
|
<div className={classes["sub-section"]}>
|
||||||
<Typography typo={ITypo.P_18}>
|
<Typography typo={ITypo.P_18}>
|
||||||
This page allows to gather all the design system of the site. A Design System is a library of components, visuals and principles with reusable code. This evolving kit offers a UX and UI repository for
|
This page allows to gather all the design system of the site. A Design System is a library of components,
|
||||||
designers and developers of digital products and services. The construction of a design system offers many advantages. This solution facilitates the work of the teams and reduces the "design debt" and the
|
visuals and principles with reusable code. This evolving kit offers a UX and UI repository for designers and
|
||||||
"technical debt". The result is a coherent ecosystem and therefore a better experience for users and customers.
|
developers of digital products and services. The construction of a design system offers many advantages.
|
||||||
|
This solution facilitates the work of the teams and reduces the "design debt" and the "technical debt". The
|
||||||
|
result is a coherent ecosystem and therefore a better experience for users and customers.
|
||||||
</Typography>
|
</Typography>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -69,8 +71,15 @@ export default class DesignSystem extends BasePage<IProps, IState> {
|
|||||||
Show Modal
|
Show Modal
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
<Confirm isOpen={this.state.isModalDisplayed} onClose={this.closeModal} closeBtn header={"Title"} cancelText={"Cancel"} confirmText={"Confirmer"}>
|
<Confirm
|
||||||
Lorem ipsum dolor sit amet consectetur. Aliquam nunc lobortis lacus vulputate sagittis sed tempor eget feugiat. Elementum malesuada at sit elit.
|
isOpen={this.state.isModalDisplayed}
|
||||||
|
onClose={this.closeModal}
|
||||||
|
closeBtn
|
||||||
|
header={"Title"}
|
||||||
|
cancelText={"Cancel"}
|
||||||
|
confirmText={"Confirmer"}>
|
||||||
|
Lorem ipsum dolor sit amet consectetur. Aliquam nunc lobortis lacus vulputate sagittis sed tempor eget feugiat.
|
||||||
|
Elementum malesuada at sit elit.
|
||||||
</Confirm>
|
</Confirm>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -94,7 +103,9 @@ export default class DesignSystem extends BasePage<IProps, IState> {
|
|||||||
<div className={classes["sub-section"]}>
|
<div className={classes["sub-section"]}>
|
||||||
<Typography typo={ITypo.H3}>RadioBox component</Typography>
|
<Typography typo={ITypo.H3}>RadioBox component</Typography>
|
||||||
</div>
|
</div>
|
||||||
<RadioBox name="RadioBox" toolTip="Radiobox with tooltip">Radio Box 1</RadioBox>
|
<RadioBox name="RadioBox" toolTip="Radiobox with tooltip">
|
||||||
|
Radio Box 1
|
||||||
|
</RadioBox>
|
||||||
<RadioBox name="RadioBox">Radio Box 2</RadioBox>
|
<RadioBox name="RadioBox">Radio Box 2</RadioBox>
|
||||||
</div>
|
</div>
|
||||||
<div className={classes["section"]}>
|
<div className={classes["section"]}>
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
@import "@Themes/constants.scss";
|
@import "@Themes/constants.scss";
|
||||||
@import "@Themes/fonts.scss";
|
@import "@Themes/fonts.scss";
|
||||||
|
|
||||||
|
|
||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
@ -1,13 +1,12 @@
|
|||||||
export interface IMockInterface {
|
export interface IMockInterface {
|
||||||
id: number,
|
id: number;
|
||||||
path: string,
|
path: string;
|
||||||
}
|
}
|
||||||
export interface IProject {
|
export interface IProject {
|
||||||
id: number,
|
id: number;
|
||||||
title: string,
|
title: string;
|
||||||
uuid: string,
|
uuid: string;
|
||||||
createdAt: Date,
|
createdAt: Date;
|
||||||
updatedAt: Date,
|
updatedAt: Date;
|
||||||
network: string,
|
network: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -26,7 +26,7 @@ $pink-hover: #e34ba9;
|
|||||||
// Soft colors
|
// Soft colors
|
||||||
$green-soft: #baf2cd;
|
$green-soft: #baf2cd;
|
||||||
$blue-soft: #a7c6d4;
|
$blue-soft: #a7c6d4;
|
||||||
$orange-soft: #FFDC99;
|
$orange-soft: #ffdc99;
|
||||||
$turquoise-soft: #c3eae6;
|
$turquoise-soft: #c3eae6;
|
||||||
$purple-soft: #c5b2d4;
|
$purple-soft: #c5b2d4;
|
||||||
$orange-soft: #ffdc99;
|
$orange-soft: #ffdc99;
|
||||||
|
@ -1 +1 @@
|
|||||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
|
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap");
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import PageNotFound from "@Front/Components/Layouts/PageNotFound"
|
import PageNotFound from "@Front/Components/Layouts/PageNotFound";
|
||||||
|
|
||||||
export default function Route() {
|
export default function Route() {
|
||||||
return <PageNotFound/>
|
return <PageNotFound />;
|
||||||
}
|
}
|
@ -4,10 +4,7 @@ import type { NextPage } from "next";
|
|||||||
import type { AppType, AppProps } from "next/app";
|
import type { AppType, AppProps } from "next/app";
|
||||||
import type { ReactElement, ReactNode } from "react";
|
import type { ReactElement, ReactNode } from "react";
|
||||||
|
|
||||||
export type NextPageWithLayout<
|
export type NextPageWithLayout<TProps = Record<string, unknown>, TInitialProps = TProps> = NextPage<TProps, TInitialProps> & {
|
||||||
TProps = Record<string, unknown>,
|
|
||||||
TInitialProps = TProps
|
|
||||||
> = NextPage<TProps, TInitialProps> & {
|
|
||||||
getLayout?: (page: ReactElement) => ReactNode;
|
getLayout?: (page: ReactElement) => ReactNode;
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -16,9 +13,7 @@ type AppPropsWithLayout = AppProps & {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const MyApp = (({ Component, pageProps }: AppPropsWithLayout) => {
|
const MyApp = (({ Component, pageProps }: AppPropsWithLayout) => {
|
||||||
const getLayout =
|
const getLayout = Component.getLayout ?? ((page) => <DefaultLayout children={page}></DefaultLayout>);
|
||||||
Component.getLayout ??
|
|
||||||
((page) => <DefaultLayout children={page}></DefaultLayout>);
|
|
||||||
|
|
||||||
return getLayout(<Component {...pageProps} />);
|
return getLayout(<Component {...pageProps} />);
|
||||||
}) as AppType;
|
}) as AppType;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user