Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| e1969a2f83 | |||
| 879c7c68d6 | |||
| 8ed9b50054 | |||
| 917b90a26d | |||
| e1e703c2d8 | |||
| dbff41b9c8 | |||
| 3ce58faa1c | |||
| 2a3a03dd31 | |||
| 8da4b7cb28 | |||
| 16fc6b69a6 |
@@ -1,16 +0,0 @@
|
|||||||
# Editor configuration, see https://editorconfig.org
|
|
||||||
root = true
|
|
||||||
|
|
||||||
[*]
|
|
||||||
charset = utf-8
|
|
||||||
indent_style = space
|
|
||||||
indent_size = 4
|
|
||||||
insert_final_newline = true
|
|
||||||
trim_trailing_whitespace = true
|
|
||||||
|
|
||||||
[*.ts]
|
|
||||||
quote_type = single
|
|
||||||
|
|
||||||
[*.md]
|
|
||||||
max_line_length = off
|
|
||||||
trim_trailing_whitespace = false
|
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
APP_ENV="development"
|
||||||
|
API_BASE_URL=http://localhost:3201
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
APP_ENV="production"
|
||||||
|
API_BASE_URL=http://api.adastra-cbd.com/api
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
APP_ENV="development"
|
||||||
|
API_BASE_URL=http://localhost:3200/api
|
||||||
@@ -1,46 +1,14 @@
|
|||||||
{
|
{
|
||||||
"root": true,
|
"extends": ["next/core-web-vitals", "next/typescript", "prettier"],
|
||||||
"ignorePatterns": [
|
"rules": {
|
||||||
"projects/**/*"
|
"@typescript-eslint/no-unused-vars": [
|
||||||
],
|
"warn",
|
||||||
"overrides": [{
|
{
|
||||||
"files": [
|
"argsIgnorePattern": "^_",
|
||||||
"*.ts"
|
"varsIgnorePattern": "^_",
|
||||||
],
|
"caughtErrorsIgnorePattern": "^_",
|
||||||
"extends": [
|
"destructuredArrayIgnorePattern": "^_"
|
||||||
"eslint:recommended",
|
}
|
||||||
"plugin:@typescript-eslint/recommended",
|
|
||||||
"plugin:@angular-eslint/recommended",
|
|
||||||
"plugin:@angular-eslint/template/process-inline-templates"
|
|
||||||
],
|
|
||||||
"rules": {
|
|
||||||
"@angular-eslint/directive-selector": [
|
|
||||||
"error",
|
|
||||||
{
|
|
||||||
"type": "attribute",
|
|
||||||
"prefix": "app",
|
|
||||||
"style": "camelCase"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"@angular-eslint/component-selector": [
|
|
||||||
"error",
|
|
||||||
{
|
|
||||||
"type": "element",
|
|
||||||
"prefix": "app",
|
|
||||||
"style": "kebab-case"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"files": [
|
|
||||||
"*.html"
|
|
||||||
],
|
|
||||||
"extends": [
|
|
||||||
"plugin:@angular-eslint/template/recommended",
|
|
||||||
"plugin:@angular-eslint/template/accessibility"
|
|
||||||
],
|
|
||||||
"rules": {}
|
|
||||||
}
|
|
||||||
]
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,10 +6,36 @@
|
|||||||
/out-tsc
|
/out-tsc
|
||||||
/bazel-out
|
/bazel-out
|
||||||
|
|
||||||
# Node
|
# dependencies
|
||||||
/node_modules
|
/node_modules
|
||||||
npm-debug.log
|
/.pnp
|
||||||
yarn-error.log
|
.pnp.js
|
||||||
|
|
||||||
|
# debug
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
.pnpm-debug.log*
|
||||||
|
|
||||||
|
# local env files
|
||||||
|
.env*.local
|
||||||
|
|
||||||
|
# production
|
||||||
|
/build
|
||||||
|
|
||||||
|
# testing
|
||||||
|
/coverage
|
||||||
|
|
||||||
|
# next.js
|
||||||
|
/.next/
|
||||||
|
/out/
|
||||||
|
|
||||||
|
# vercel
|
||||||
|
.vercel
|
||||||
|
|
||||||
|
# typescript
|
||||||
|
*.tsbuildinfo
|
||||||
|
next-env.d.ts
|
||||||
|
|
||||||
# IDEs and editors
|
# IDEs and editors
|
||||||
.idea/
|
.idea/
|
||||||
@@ -33,10 +59,10 @@ yarn-error.log
|
|||||||
.nx/
|
.nx/
|
||||||
.sass-cache/
|
.sass-cache/
|
||||||
/connect.lock
|
/connect.lock
|
||||||
/coverage
|
|
||||||
/libpeerconnection.log
|
/libpeerconnection.log
|
||||||
testem.log
|
testem.log
|
||||||
/typings
|
/typings
|
||||||
|
*.pem
|
||||||
|
|
||||||
# e2e
|
# e2e
|
||||||
/e2e/*.js
|
/e2e/*.js
|
||||||
@@ -54,5 +80,4 @@ sonar.properties
|
|||||||
**/*.copy.scss
|
**/*.copy.scss
|
||||||
**/*.copy.html
|
**/*.copy.html
|
||||||
|
|
||||||
.next/
|
certificates
|
||||||
next-env.d.ts
|
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
npm test
|
||||||
|
#prettier $(git diff --cached --name-only --diff-filter=ACMR | sed 's| |\\ |g') --write --ignore-unknown
|
||||||
|
#git update-index --again
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
# Ignore artifacts:
|
||||||
|
build
|
||||||
|
coverage
|
||||||
|
|
||||||
|
# auto generated files
|
||||||
|
src/generated
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"printWidth": 120
|
||||||
|
}
|
||||||
@@ -1,72 +0,0 @@
|
|||||||
# CLAUDE.md
|
|
||||||
|
|
||||||
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
||||||
|
|
||||||
## Commands
|
|
||||||
|
|
||||||
- `npm start` — dev server (production config) on port 4200
|
|
||||||
- `npm run dev` — dev server with `APP_ENV=development` on port 4300, uses `environment.development.ts`
|
|
||||||
- `npm run local` — dev server with `APP_ENV=local` on port 4400, uses `environment.local.ts`
|
|
||||||
- `npm run serve` — alias for local config on port 4201
|
|
||||||
- `npm run build` — production build to `dist/adastra_angular/`
|
|
||||||
- `npm run watch` — incremental build in development configuration
|
|
||||||
- `npm run lint` — angular-eslint over `src/**/*.ts` and `src/**/*.html`
|
|
||||||
- `npm test` — Karma + Jasmine (single spec: `ng test --include src/path/to/file.spec.ts`)
|
|
||||||
|
|
||||||
Node engines: `^18.19.1 || ^20.11.1`. Angular 18, TypeScript 5.5, strict mode with `strictTemplates`.
|
|
||||||
|
|
||||||
## Environments
|
|
||||||
|
|
||||||
`src/environments/environment.ts` is the default (production). `environment.development.ts` and `environment.local.ts` are swapped in via `fileReplacements` in `angular.json` for their respective configurations. `environment.example.ts` documents the expected shape (`apiBaseUrl`, `apiKey`, `useApiKey`, `refreshInterval`, `googleMapApiKey`). Never commit real keys to the development/local files — the production `environment.ts` currently has real keys checked in; be mindful.
|
|
||||||
|
|
||||||
## Architecture
|
|
||||||
|
|
||||||
Standalone Angular 18 app (no NgModules) wired up in [src/app/app.config.ts](src/app/app.config.ts). It provides the router with `withViewTransitions()`, three HTTP interceptors, charts, French locale (`fr-FR`), and an `APP_INITIALIZER` that eagerly fetches the current user when a JWT is present in localStorage.
|
|
||||||
|
|
||||||
### Routing split
|
|
||||||
|
|
||||||
Routes are composed in [src/app/app.routes.ts](src/app/app.routes.ts) from two arrays:
|
|
||||||
- [src/app/routes/auth.routes.ts](src/app/routes/auth.routes.ts) — `authGuard`-protected routes. Skydive admin sections (`aeronefs`, `canopies`, `dashboard`, `dropzones`, `jumps`) additionally require `adminGuard`.
|
|
||||||
- [src/app/routes/noauth.routes.ts](src/app/routes/noauth.routes.ts) — public pages and auth-entry routes (`login`, `register`) gated by `noauthGuard` (blocks entry when already authenticated).
|
|
||||||
|
|
||||||
Resolvers under [src/app/core/resolvers/](src/app/core/resolvers/) pre-fetch data for each route — new route components should generally follow this pattern rather than fetching in `ngOnInit`.
|
|
||||||
|
|
||||||
### HTTP pipeline
|
|
||||||
|
|
||||||
Three interceptors chained in order ([src/app/core/interceptors/](src/app/core/interceptors/)):
|
|
||||||
1. `apiInterceptor` — prepends `environment.apiBaseUrl` to every request URL. **Consequence:** services call relative paths like `/cms/user`, never absolute URLs.
|
|
||||||
2. `tokenInterceptor` — attaches `Authorization: Token <jwt>` when a token exists.
|
|
||||||
3. `errorInterceptor` — unwraps `err.error` and rethrows.
|
|
||||||
|
|
||||||
`ApiService` ([api.service.ts](src/app/core/services/api.service.ts)) is a thin `HttpClient` wrapper; most feature services call it with a versioned prefix (e.g., `_apiDomain = '/skydive'` or `/cms`). The API version is per-service, not global.
|
|
||||||
|
|
||||||
### Auth flow
|
|
||||||
|
|
||||||
`JwtService` stores the token in `localStorage['jwtToken']`. `UserService` exposes `currentUser` (BehaviorSubject) and `isAuthenticated` (ReplaySubject) observables consumed by guards and the layout. The `APP_INITIALIZER` in `app.config.ts` calls `userService.getCurrentUser()` if a token exists, so guards can rely on `isAuthenticated` being populated on first navigation. Admin role check is `currentUser.role === 'Admin'`.
|
|
||||||
|
|
||||||
### Layout
|
|
||||||
|
|
||||||
[AppComponent](src/app/app.component.ts) renders only `FullComponent` ([src/app/components/shared/layout/full.component.ts](src/app/components/shared/layout/full.component.ts)), which owns the Material sidenav + toolbar shell and swaps menu items between `MENUITEMS` and `MENUITEMSADMIN` defined in [src/app/components/shared/menu-items.ts](src/app/components/shared/menu-items.ts) based on role. Route changes render inside its `<router-outlet>`.
|
|
||||||
|
|
||||||
### Feature areas
|
|
||||||
|
|
||||||
The app spans four mostly-independent feature domains, mirroring the backend's route grouping:
|
|
||||||
- **E-commerce** — `products`, `product/:slug`, `products/:category` (public + auth variants). Categories are baked into menu items, not dynamic. Backend counterpart: `/api/ecommerce/*`.
|
|
||||||
- **CMS** — `pages`, `page/:slug`, `home`, profiles, articles. Backend counterpart: `/api/cms/*`.
|
|
||||||
- **Skydive** — `skydive/*` routes, services in [src/app/core/services/skydive/](src/app/core/services/skydive/), QCM exam data in `src/app/components/qcm/*.json` and `src/qcm-bpa.json`. Backend counterpart: `/api/skydive/*`.
|
|
||||||
- **Hero Wars** — analytics for a game guild, services in [src/app/core/services/herowars/](src/app/core/services/herowars/), weekly data snapshots in [src/files-data/](src/files-data/) (`Week_XX` folders and `hw-*.json` files are static data shipped as assets). Backend counterpart: `/api/herowars/*`.
|
|
||||||
|
|
||||||
### Path aliases
|
|
||||||
|
|
||||||
Configured in [tsconfig.json](tsconfig.json) and used everywhere — prefer them over relative paths:
|
|
||||||
`@components`, `@services`, `@models`, `@guards`, `@interceptors`, `@resolvers`, `@viewmodels`, `@interfaces`, `@constants`, `@core/*`, `@environments/*`, `@data/*` (→ `src/files-data/*`), `@assets/*`, `@styles/*`.
|
|
||||||
|
|
||||||
Each alias points at an `index.ts` barrel — when adding a new component/service/model, also export it from the appropriate barrel or it won't be importable via the alias.
|
|
||||||
|
|
||||||
### Styling
|
|
||||||
|
|
||||||
SCSS with `includePaths: ["src/styles"]` so imports like `@use 'variables'` resolve. Global Chartist styles are registered in `angular.json` build options. Material 18 with French date locale and `DD/MM/YYYY` format configured in `AppComponent`'s providers.
|
|
||||||
|
|
||||||
## Related service
|
|
||||||
|
|
||||||
The backend API lives in a sibling repo at `/Users/julien/Sites/adastra_api` (Express + Sequelize, additional working directory). Routes are grouped under `src/routes/api/` into the same four domains as the frontend: `skydive`, `cms`, `ecommerce`, `herowars`. The `v1`, `v2`, `v3` folders alongside them are legacy backups slated for removal — ignore them. When a task spans both repos (e.g., adding an endpoint + consumer), check there as well.
|
|
||||||
@@ -1,27 +1,42 @@
|
|||||||
# Ad Astra
|
# AdAstra_App
|
||||||
|
|
||||||
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.2.2.
|
## Libraries and Frameworks
|
||||||
|
|
||||||
## Development server
|
| Name | |
|
||||||
|
| --------------------------------------------- | ---------------------------------- |
|
||||||
|
| [TypeScript](https://www.typescriptlang.org/) | v5.5.x |
|
||||||
|
| [Next.js](https://nextjs.org/) | v15.x |
|
||||||
|
| [React](https://react.dev/) | v18.x |
|
||||||
|
| [Conform](https://conform.guide/) | form validation library |
|
||||||
|
| [Zod](https://zod.dev/) | schema validation library |
|
||||||
|
| [unified](https://unifiedjs.com/) | markdown to html converter |
|
||||||
|
| [OpenAPI TypeScript](https://openapi-ts.dev/) | type generator from OpenAPI schema |
|
||||||
|
|
||||||
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
|
## Getting Started
|
||||||
|
|
||||||
## Code scaffolding
|
```bash
|
||||||
|
# copy env
|
||||||
|
cp .env.example .env.local
|
||||||
|
|
||||||
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
|
# set API_BASE_URL variable in .env.local to your backend api endpoint
|
||||||
|
|
||||||
## Build
|
# run app
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
|
## Directory structure
|
||||||
|
|
||||||
## Running unit tests
|
```plaintext
|
||||||
|
.
|
||||||
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
├── api/ # api schema
|
||||||
|
├── public/ # static assets
|
||||||
## Running end-to-end tests
|
└── src/
|
||||||
|
├── app/ # web routes
|
||||||
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
|
├── config/ # global configuration and constants
|
||||||
|
├── generated/ # automatically generated codes
|
||||||
## Further help
|
├── modules/
|
||||||
|
│ ├── common/ # common (feature-independent) components
|
||||||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
|
│ └── features/ # feature-specific components
|
||||||
|
├── styles/ # global style sheets
|
||||||
|
└── utils/ # utilities
|
||||||
|
```
|
||||||
|
|||||||
@@ -1,172 +0,0 @@
|
|||||||
{
|
|
||||||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
|
||||||
"version": 1,
|
|
||||||
"cli": {
|
|
||||||
"packageManager": "npm",
|
|
||||||
"analytics": false,
|
|
||||||
"schematicCollections": [
|
|
||||||
"@angular-eslint/schematics"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"newProjectRoot": "projects",
|
|
||||||
"projects": {
|
|
||||||
"adastra_angular": {
|
|
||||||
"projectType": "application",
|
|
||||||
"schematics": {
|
|
||||||
"@schematics/angular:component": {
|
|
||||||
"style": "scss"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"i18n": {
|
|
||||||
"sourceLocale": "fr"
|
|
||||||
},
|
|
||||||
"root": "",
|
|
||||||
"sourceRoot": "src",
|
|
||||||
"prefix": "app",
|
|
||||||
"architect": {
|
|
||||||
"build": {
|
|
||||||
"builder": "@angular-devkit/build-angular:application",
|
|
||||||
"options": {
|
|
||||||
"outputPath": {
|
|
||||||
"base": "dist/adastra_angular"
|
|
||||||
},
|
|
||||||
"index": "src/index.html",
|
|
||||||
"tsConfig": "tsconfig.app.json",
|
|
||||||
"polyfills": [
|
|
||||||
"@angular/localize/init",
|
|
||||||
"zone.js"
|
|
||||||
],
|
|
||||||
"inlineStyleLanguage": "scss",
|
|
||||||
"assets": [
|
|
||||||
"src/favicon.ico",
|
|
||||||
"src/assets",
|
|
||||||
"src/manifest.webmanifest",
|
|
||||||
{
|
|
||||||
"glob": "_redirects",
|
|
||||||
"input": "src",
|
|
||||||
"output": "/"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"styles": [
|
|
||||||
"node_modules/chartist/dist/index.scss",
|
|
||||||
"src/styles/styles.scss"
|
|
||||||
],
|
|
||||||
"stylePreprocessorOptions": {
|
|
||||||
"includePaths": ["src/styles"]
|
|
||||||
},
|
|
||||||
"scripts": [],
|
|
||||||
"browser": "src/main.ts"
|
|
||||||
},
|
|
||||||
"configurations": {
|
|
||||||
"production": {
|
|
||||||
"extractLicenses": true,
|
|
||||||
"namedChunks": false,
|
|
||||||
"optimization": true,
|
|
||||||
"outputHashing": "all",
|
|
||||||
"sourceMap": false,
|
|
||||||
"budgets": [
|
|
||||||
{
|
|
||||||
"type": "initial",
|
|
||||||
"maximumWarning": "500kb",
|
|
||||||
"maximumError": "1mb"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "anyComponentStyle",
|
|
||||||
"maximumWarning": "2kb",
|
|
||||||
"maximumError": "4kb"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"development": {
|
|
||||||
"extractLicenses": false,
|
|
||||||
"namedChunks": true,
|
|
||||||
"optimization": false,
|
|
||||||
"sourceMap": true,
|
|
||||||
"budgets": [
|
|
||||||
{
|
|
||||||
"type": "anyComponentStyle",
|
|
||||||
"maximumWarning": "6kb"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"fileReplacements": [
|
|
||||||
{
|
|
||||||
"replace": "src/environments/environment.ts",
|
|
||||||
"with": "src/environments/environment.development.ts"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"local": {
|
|
||||||
"extractLicenses": false,
|
|
||||||
"namedChunks": true,
|
|
||||||
"optimization": false,
|
|
||||||
"sourceMap": true,
|
|
||||||
"budgets": [
|
|
||||||
{
|
|
||||||
"type": "anyComponentStyle",
|
|
||||||
"maximumWarning": "6kb"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"fileReplacements": [
|
|
||||||
{
|
|
||||||
"replace": "src/environments/environment.ts",
|
|
||||||
"with": "src/environments/environment.local.ts"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"defaultConfiguration": "production"
|
|
||||||
},
|
|
||||||
"serve": {
|
|
||||||
"builder": "@angular-devkit/build-angular:dev-server",
|
|
||||||
"configurations": {
|
|
||||||
"production": {
|
|
||||||
"buildTarget": "adastra_angular:build:production"
|
|
||||||
},
|
|
||||||
"development": {
|
|
||||||
"buildTarget": "adastra_angular:build:development"
|
|
||||||
},
|
|
||||||
"local": {
|
|
||||||
"buildTarget": "adastra_angular:build:local"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"defaultConfiguration": "development"
|
|
||||||
},
|
|
||||||
"extract-i18n": {
|
|
||||||
"builder": "@angular-devkit/build-angular:extract-i18n",
|
|
||||||
"options": {
|
|
||||||
"buildTarget": "adastra_angular:build"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"test": {
|
|
||||||
"builder": "@angular-devkit/build-angular:karma",
|
|
||||||
"options": {
|
|
||||||
"polyfills": [
|
|
||||||
"zone.js",
|
|
||||||
"zone.js/testing"
|
|
||||||
],
|
|
||||||
"tsConfig": "tsconfig.spec.json",
|
|
||||||
"inlineStyleLanguage": "scss",
|
|
||||||
"assets": [
|
|
||||||
"src/favicon.ico",
|
|
||||||
"src/assets",
|
|
||||||
"src/manifest.webmanifest"
|
|
||||||
],
|
|
||||||
"styles": [
|
|
||||||
"src/styles/styles.scss"
|
|
||||||
],
|
|
||||||
"scripts": []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"lint": {
|
|
||||||
"builder": "@angular-eslint/builder:lint",
|
|
||||||
"options": {
|
|
||||||
"lintFilePatterns": [
|
|
||||||
"src/**/*.ts",
|
|
||||||
"src/**/*.html"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
/** @type {import('next').NextConfig} */
|
||||||
|
const nextConfig = {
|
||||||
|
reactStrictMode: true,
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = nextConfig
|
||||||
@@ -1,67 +1,49 @@
|
|||||||
{
|
{
|
||||||
"name": "adastra-app",
|
"name": "adastra-nextjs",
|
||||||
"version": "1.0.0",
|
"version": "0.1.0",
|
||||||
"author": "Solide Apps <admin@unespace.com>",
|
|
||||||
"contributors": [
|
|
||||||
"Julien Gautier <julien.gautier@unespace.com>"
|
|
||||||
],
|
|
||||||
"scripts": {
|
|
||||||
"ng": "ng",
|
|
||||||
"start": "ng serve",
|
|
||||||
"build": "ng build",
|
|
||||||
"watch": "ng build --watch --configuration development",
|
|
||||||
"serve": "ng serve --configuration local --port 4201",
|
|
||||||
"dev": "APP_ENV=development ng serve --port 4300 --configuration development",
|
|
||||||
"local": "APP_ENV=local ng serve --port 4400 --configuration local",
|
|
||||||
"lint": "ng lint",
|
|
||||||
"test": "ng test"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": "^18.19.1 || ^20.11.1"
|
|
||||||
},
|
|
||||||
"private": true,
|
"private": true,
|
||||||
|
"stackblitz": {
|
||||||
|
"startCommand": "npm start"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"dev": "next dev --port 4201",
|
||||||
|
"secure": "next dev --experimental-https",
|
||||||
|
"build": "next build",
|
||||||
|
"start": "next start",
|
||||||
|
"lint": "next lint",
|
||||||
|
"prepare": "husky",
|
||||||
|
"format": "prettier . --write",
|
||||||
|
"fix": "next lint --fix",
|
||||||
|
"test": "npm run build",
|
||||||
|
"openapi-generate": "openapi-typescript ./api/openapi.yml --output ./src/generated/apiSchema.generated.d.ts"
|
||||||
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@angular/animations": "^18.2.14",
|
"@conform-to/react": "^1.2.2",
|
||||||
"@angular/cdk": "^18.2.14",
|
"@conform-to/zod": "^1.2.2",
|
||||||
"@angular/common": "^18.2.14",
|
"clsx": "^2.1.1",
|
||||||
"@angular/compiler": "^18.2.14",
|
|
||||||
"@angular/core": "^18.2.14",
|
|
||||||
"@angular/forms": "^18.2.14",
|
|
||||||
"@angular/google-maps": "^17.3.8",
|
|
||||||
"@angular/localize": "^18.2.14",
|
|
||||||
"@angular/material": "^18.2.14",
|
|
||||||
"@angular/platform-browser": "^18.2.14",
|
|
||||||
"@angular/platform-browser-dynamic": "^18.2.14",
|
|
||||||
"@angular/router": "^18.2.14",
|
|
||||||
"bootstrap": "^5.3.7",
|
"bootstrap": "^5.3.7",
|
||||||
"chart.js": "^4.4.2",
|
"next": "^15.4.5",
|
||||||
"chartist": "^1.3.0",
|
"react": "^19.1.1",
|
||||||
"ng-chartist": "^8.2.0",
|
"react-bootstrap": "^2.10.10",
|
||||||
"ng2-charts": "^6.0.1",
|
"react-dom": "^19.1.1",
|
||||||
"ngx-skeleton-loader": "^9.0.0",
|
"rehype-stringify": "^10.0.1",
|
||||||
"rxjs": "~7.8.0",
|
"remark-parse": "^11.0.0",
|
||||||
"tslib": "^2.3.0",
|
"remark-rehype": "^11.1.1",
|
||||||
"zone.js": "^0.14.10"
|
"unified": "^11.0.5",
|
||||||
|
"zod": "^3.23.8"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@angular-devkit/build-angular": "^18.2.21",
|
"@types/node": "^24.1.0",
|
||||||
"@angular-eslint/builder": "18.4.3",
|
"@types/react": "^19.1.9",
|
||||||
"@angular-eslint/eslint-plugin": "18.4.3",
|
"@types/react-dom": "^19.1.7",
|
||||||
"@angular-eslint/eslint-plugin-template": "18.4.3",
|
"eslint": "^9.32.0",
|
||||||
"@angular-eslint/schematics": "18.4.3",
|
"eslint-config-next": "^15.4.5",
|
||||||
"@angular-eslint/template-parser": "18.4.3",
|
"eslint-config-prettier": "^9.1.0",
|
||||||
"@angular/cli": "^18.2.21",
|
"husky": "^9.1.6",
|
||||||
"@angular/compiler-cli": "^18.2.14",
|
"lint-staged": "^15.2.10",
|
||||||
"@types/jasmine": "~5.1.0",
|
"openapi-typescript": "^7.4.1",
|
||||||
"@typescript-eslint/eslint-plugin": "7.2.0",
|
"prettier": "^3.3.3",
|
||||||
"@typescript-eslint/parser": "7.2.0",
|
"typescript": "^5.9.2",
|
||||||
"eslint": "^8.57.0",
|
"sass": "^1.89.2"
|
||||||
"jasmine-core": "~5.1.0",
|
|
||||||
"karma": "~6.4.0",
|
|
||||||
"karma-chrome-launcher": "~3.2.0",
|
|
||||||
"karma-coverage": "~2.2.0",
|
|
||||||
"karma-jasmine": "~5.1.0",
|
|
||||||
"karma-jasmine-html-reporter": "~2.1.0",
|
|
||||||
"typescript": "~5.5.4"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 8.3 KiB After Width: | Height: | Size: 8.3 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.6 KiB |
|
Before Width: | Height: | Size: 4.7 KiB After Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 5.6 KiB After Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 5.9 KiB |
|
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.7 KiB |
|
Before Width: | Height: | Size: 9.6 KiB After Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.6 KiB |
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 3.8 KiB |
|
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 8.9 KiB |
|
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 8.9 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 7.6 KiB After Width: | Height: | Size: 7.6 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
@@ -0,0 +1,19 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<metadata>Generated by IcoMoon</metadata>
|
||||||
|
<defs>
|
||||||
|
<font id="icomoon" horiz-adv-x="1024">
|
||||||
|
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||||
|
<missing-glyph horiz-adv-x="1024" />
|
||||||
|
<glyph unicode=" " horiz-adv-x="512" d="" />
|
||||||
|
<glyph unicode="" glyph-name="home" d="M1024 369.556l-512 397.426-512-397.428v162.038l512 397.426 512-397.428zM896 384v-384h-256v256h-256v-256h-256v384l384 288z" />
|
||||||
|
<glyph unicode="" glyph-name="pencil" d="M864 960c88.364 0 160-71.634 160-160 0-36.020-11.91-69.258-32-96l-64-64-224 224 64 64c26.742 20.090 59.978 32 96 32zM64 224l-64-288 288 64 592 592-224 224-592-592zM715.578 596.422l-448-448-55.156 55.156 448 448 55.156-55.156z" />
|
||||||
|
<glyph unicode="" glyph-name="cart" d="M384 32c0-53.019-42.981-96-96-96s-96 42.981-96 96c0 53.019 42.981 96 96 96s96-42.981 96-96zM1024 32c0-53.019-42.981-96-96-96s-96 42.981-96 96c0 53.019 42.981 96 96 96s96-42.981 96-96zM1024 448v384h-768c0 35.346-28.654 64-64 64h-192v-64h128l48.074-412.054c-29.294-23.458-48.074-59.5-48.074-99.946 0-70.696 57.308-128 128-128h768v64h-768c-35.346 0-64 28.654-64 64 0 0.218 0.014 0.436 0.016 0.656l831.984 127.344z" />
|
||||||
|
<glyph unicode="" glyph-name="phone" d="M704 320c-64-64-64-128-128-128s-128 64-192 128-128 128-128 192 64 64 128 128-128 256-192 256-192-192-192-192c0-128 131.5-387.5 256-512s384-256 512-256c0 0 192 128 192 192s-192 256-256 192z" />
|
||||||
|
<glyph unicode="" glyph-name="envelop" d="M928 832h-832c-52.8 0-96-43.2-96-96v-640c0-52.8 43.2-96 96-96h832c52.8 0 96 43.2 96 96v640c0 52.8-43.2 96-96 96zM398.74 409.628l-270.74-210.892v501.642l270.74-290.75zM176.38 704h671.24l-335.62-252-335.62 252zM409.288 398.302l102.712-110.302 102.71 110.302 210.554-270.302h-626.528l210.552 270.302zM625.26 409.628l270.74 290.75v-501.642l-270.74 210.892z" />
|
||||||
|
<glyph unicode="" glyph-name="calendar" d="M320 576h128v-128h-128zM512 576h128v-128h-128zM704 576h128v-128h-128zM128 192h128v-128h-128zM320 192h128v-128h-128zM512 192h128v-128h-128zM320 384h128v-128h-128zM512 384h128v-128h-128zM704 384h128v-128h-128zM128 384h128v-128h-128zM832 960v-64h-128v64h-448v-64h-128v64h-128v-1024h960v1024h-128zM896 0h-832v704h832v-704z" />
|
||||||
|
<glyph unicode="" glyph-name="user" d="M576 253.388v52.78c70.498 39.728 128 138.772 128 237.832 0 159.058 0 288-192 288s-192-128.942-192-288c0-99.060 57.502-198.104 128-237.832v-52.78c-217.102-17.748-384-124.42-384-253.388h896c0 128.968-166.898 235.64-384 253.388z" />
|
||||||
|
<glyph unicode="" glyph-name="earth" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512-0.002c-62.958 0-122.872 13.012-177.23 36.452l233.148 262.29c5.206 5.858 8.082 13.422 8.082 21.26v96c0 17.674-14.326 32-32 32-112.99 0-232.204 117.462-233.374 118.626-6 6.002-14.14 9.374-22.626 9.374h-128c-17.672 0-32-14.328-32-32v-192c0-12.122 6.848-23.202 17.69-28.622l110.31-55.156v-187.886c-116.052 80.956-192 215.432-192 367.664 0 68.714 15.49 133.806 43.138 192h116.862c8.488 0 16.626 3.372 22.628 9.372l128 128c6 6.002 9.372 14.14 9.372 22.628v77.412c40.562 12.074 83.518 18.588 128 18.588 70.406 0 137.004-16.26 196.282-45.2-4.144-3.502-8.176-7.164-12.046-11.036-36.266-36.264-56.236-84.478-56.236-135.764s19.97-99.5 56.236-135.764c36.434-36.432 85.218-56.264 135.634-56.26 3.166 0 6.342 0.080 9.518 0.236 13.814-51.802 38.752-186.656-8.404-372.334-0.444-1.744-0.696-3.488-0.842-5.224-81.324-83.080-194.7-134.656-320.142-134.656z" />
|
||||||
|
<glyph unicode="" glyph-name="link" d="M440.236 324.234c-13.31 0-26.616 5.076-36.77 15.23-95.134 95.136-95.134 249.934 0 345.070l192 192c46.088 46.086 107.36 71.466 172.534 71.466s126.448-25.38 172.536-71.464c95.132-95.136 95.132-249.934 0-345.070l-87.766-87.766c-20.308-20.308-53.23-20.308-73.54 0-20.306 20.306-20.306 53.232 0 73.54l87.766 87.766c54.584 54.586 54.584 143.404 0 197.99-26.442 26.442-61.6 41.004-98.996 41.004s-72.552-14.562-98.996-41.006l-192-191.998c-54.586-54.586-54.586-143.406 0-197.992 20.308-20.306 20.306-53.232 0-73.54-10.15-10.152-23.462-15.23-36.768-15.23zM256-52c-65.176 0-126.45 25.38-172.534 71.464-95.134 95.136-95.134 249.934 0 345.070l87.764 87.764c20.308 20.306 53.234 20.306 73.54 0 20.308-20.306 20.308-53.232 0-73.54l-87.764-87.764c-54.586-54.586-54.586-143.406 0-197.992 26.44-26.44 61.598-41.002 98.994-41.002s72.552 14.562 98.998 41.006l192 191.998c54.584 54.586 54.584 143.406 0 197.992-20.308 20.308-20.306 53.232 0 73.54 20.306 20.306 53.232 20.306 73.54-0.002 95.132-95.134 95.132-249.932 0.002-345.068l-192.002-192c-46.090-46.088-107.364-71.466-172.538-71.466z" />
|
||||||
|
</font></defs></svg>
|
||||||
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 29 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 14 KiB |
@@ -0,0 +1,55 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg version="1.1" id="Logo_Ad_Astra" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" width="218px" height="48px" viewBox="0 0 218 48" enable-background="new 0 0 218 48" xml:space="preserve">
|
||||||
|
<g id="Ad_Astra_3_">
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="66.158,26.352 64.543,20.319 54.508,20.319 52.896,26.352 "/>
|
||||||
|
<polygon fill="#D7C067" points="62.985,38.615 63.716,41.5 70.209,41.5 66.724,28.614 60.308,28.614 61.658,33.665 57.394,33.665
|
||||||
|
58.745,28.614 52.25,28.614 48.842,41.5 55.299,41.5 56.069,38.615 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M92.467,26.352v-1.212c0-1.325-0.508-2.472-1.51-3.409c-1.003-0.937-2.23-1.412-3.647-1.412H71.733v6.033
|
||||||
|
H92.467z"/>
|
||||||
|
<path fill="#D7C067" d="M92.467,28.614h-6.456v6.853H78.19v-6.853h-6.457V41.5H87.31c1.418,0,2.645-0.475,3.647-1.411
|
||||||
|
c1.002-0.938,1.51-2.083,1.51-3.409V28.614z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="119.495,26.352 117.88,20.319 107.846,20.319 106.232,26.352 "/>
|
||||||
|
<polygon fill="#D7C067" points="116.322,38.615 117.053,41.5 123.546,41.5 120.061,28.614 113.644,28.614 114.995,33.665
|
||||||
|
110.73,33.665 112.081,28.614 105.588,28.614 102.179,41.5 108.635,41.5 109.406,38.615 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M145.803,33.434c0-1.324-0.508-2.471-1.509-3.408c-1.002-0.937-2.229-1.412-3.647-1.412h-15.571
|
||||||
|
c0.056,1.229,0.561,2.297,1.505,3.179c1.001,0.936,2.229,1.41,3.647,1.41h9.121v2.264H125.07V41.5h15.576
|
||||||
|
c1.418,0,2.645-0.475,3.647-1.411c1.001-0.938,1.509-2.083,1.509-3.409V33.434z"/>
|
||||||
|
<path fill="#D7C067" d="M125.07,26.352h20.732v-6.033h-15.575c-1.417,0-2.646,0.475-3.647,1.412
|
||||||
|
c-1.002,0.936-1.51,2.084-1.51,3.409V26.352z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="155.362" y="28.614" fill="#D7C067" width="6.456" height="12.886"/>
|
||||||
|
<rect x="148.223" y="20.319" fill="#D7C067" width="20.733" height="6.033"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M192.109,26.352v-1.212c0-1.325-0.508-2.472-1.51-3.409c-1.003-0.937-2.23-1.412-3.647-1.412h-15.576
|
||||||
|
v6.033H192.109z"/>
|
||||||
|
<path fill="#D7C067" d="M171.375,41.5h6.456v-8.296h7.823V41.5h6.456v-8.066c0-0.679-0.481-1.473-1.432-2.362l-0.174-0.163
|
||||||
|
l0.174-0.163c0.846-0.79,1.319-1.506,1.414-2.132h-20.716V41.5z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="207.776,38.615 208.508,41.5 215,41.5 211.515,28.614 205.099,28.614 206.45,33.665
|
||||||
|
202.185,33.665 203.536,28.614 197.041,28.614 193.632,41.5 200.088,41.5 200.861,38.615 "/>
|
||||||
|
<polygon fill="#D7C067" points="210.948,26.352 209.335,20.319 199.3,20.319 197.686,26.352 "/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g id="Star_1_">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" fill="#DDDCDB" d="M67.011,15.14c-15.125-0.415-30.13,11.212-42.833,19.917
|
||||||
|
l5.321-16.303l2.163,5.883c0.43,1.075,0.917,0.809,2.133,0.276C45.682,19.162,51.53,13.062,67.011,15.14z"/>
|
||||||
|
<path fill="#D7C067" d="M21.111,39.24l8.584-6.51l9.078,9.012l-8.772-5.538L16.491,46l4.396-17.216L3,19.504l21.795,7.159
|
||||||
|
L21.111,39.24z"/>
|
||||||
|
<path fill="#D7C067" d="M25.738,23.656L7.23,18.529l16.482,1.101l2.655-8.707l2.032,5.081L25.738,23.656z"/>
|
||||||
|
<path fill="#D7C067" d="M28.784,3l6.61,15.685c0.112,0.257,0.211,0.435,0.442,0.326c9.763-4.918,17.872-12.196,41.689-4.196
|
||||||
|
c-25.071-5.188-30.394,2.068-43.894,8.159c-0.269,0.111-0.497-0.09-0.729-0.662L27.238,8.07L28.784,3z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
@@ -0,0 +1,55 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg version="1.1" id="Logo_Ad_Astra" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" width="272px" height="60px" viewBox="0 0 272 60" enable-background="new 0 0 272 60" xml:space="preserve">
|
||||||
|
<g id="Ad_Astra_3_">
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="82.246,32.325 80.22,24.75 67.628,24.75 65.604,32.325 "/>
|
||||||
|
<polygon fill="#D7C067" points="78.265,47.726 79.182,51.349 87.329,51.349 82.955,35.167 74.905,35.167 76.599,41.509
|
||||||
|
71.25,41.509 72.944,35.166 64.795,35.167 60.519,51.349 68.62,51.349 69.587,47.726 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M115.256,32.325v-1.523c0-1.663-0.637-3.104-1.895-4.28c-1.258-1.176-2.797-1.773-4.575-1.773H89.241
|
||||||
|
v7.576H115.256z"/>
|
||||||
|
<path fill="#D7C067" d="M115.256,35.167h-8.1v8.606h-9.814v-8.606h-8.101v16.182h19.544c1.779,0,3.318-0.596,4.575-1.772
|
||||||
|
c1.258-1.177,1.895-2.617,1.895-4.28V35.167z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="149.168,32.325 147.142,24.75 134.552,24.75 132.527,32.325 "/>
|
||||||
|
<polygon fill="#D7C067" points="145.187,47.726 146.104,51.349 154.25,51.349 149.878,35.167 141.827,35.167 143.522,41.509
|
||||||
|
138.171,41.509 139.866,35.166 131.718,35.167 127.441,51.349 135.542,51.349 136.51,47.726 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M182.177,41.219c0-1.662-0.637-3.103-1.894-4.279c-1.257-1.177-2.797-1.773-4.576-1.773h-19.537
|
||||||
|
c0.07,1.543,0.704,2.885,1.888,3.992c1.257,1.175,2.797,1.771,4.576,1.771h11.444v2.843h-17.915v7.576h19.543
|
||||||
|
c1.779,0,3.319-0.596,4.576-1.772c1.256-1.177,1.894-2.617,1.894-4.28V41.219z"/>
|
||||||
|
<path fill="#D7C067" d="M156.164,32.325h26.013V24.75h-19.542c-1.778,0-3.319,0.597-4.576,1.773
|
||||||
|
c-1.257,1.175-1.895,2.617-1.895,4.28V32.325z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="194.171" y="35.167" fill="#D7C067" width="8.101" height="16.182"/>
|
||||||
|
<rect x="185.214" y="24.75" fill="#D7C067" width="26.015" height="7.576"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M240.278,32.325v-1.523c0-1.663-0.637-3.104-1.895-4.28c-1.259-1.176-2.798-1.773-4.576-1.773h-19.544
|
||||||
|
v7.576H240.278z"/>
|
||||||
|
<path fill="#D7C067" d="M214.264,51.349h8.1V40.93h9.815v10.418h8.1V41.219c0-0.852-0.604-1.85-1.796-2.966l-0.219-0.204
|
||||||
|
l0.219-0.205c1.061-0.992,1.655-1.891,1.774-2.677h-25.992V51.349z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="259.936,47.726 260.854,51.349 269,51.349 264.627,35.167 256.577,35.167 258.272,41.509
|
||||||
|
252.92,41.509 254.616,35.166 246.466,35.167 242.189,51.349 250.291,51.349 251.26,47.726 "/>
|
||||||
|
<polygon fill="#D7C067" points="263.916,32.325 261.893,24.75 249.301,24.75 247.275,32.325 "/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g id="Star_1_">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" fill="#DDDCDB" d="M83.315,18.245c-18.977-0.521-37.805,14.08-53.743,25.012
|
||||||
|
l6.676-20.473l2.715,7.387c0.54,1.35,1.15,1.016,2.676,0.347C56.554,23.297,63.892,15.637,83.315,18.245z"/>
|
||||||
|
<path fill="#D7C067" d="M25.725,48.51l10.771-8.175l11.39,11.317l-11.007-6.955L19.927,57l5.516-21.621L3,23.726l27.347,8.99
|
||||||
|
L25.725,48.51z"/>
|
||||||
|
<path fill="#D7C067" d="M31.53,28.94L8.308,22.501l20.681,1.383l3.331-10.934l2.55,6.38L31.53,28.94z"/>
|
||||||
|
<path fill="#D7C067" d="M35.352,3l8.294,19.697c0.14,0.322,0.265,0.545,0.554,0.408C56.45,16.93,66.625,7.79,96.508,17.836
|
||||||
|
c-31.457-6.516-38.135,2.598-55.074,10.246c-0.337,0.14-0.624-0.113-0.914-0.832L33.412,9.368L35.352,3z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.5 KiB |
@@ -0,0 +1,41 @@
|
|||||||
|
{
|
||||||
|
"name": "App",
|
||||||
|
"icons": [
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-36x36.png",
|
||||||
|
"sizes": "36x36",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "0.75"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-48x48.png",
|
||||||
|
"sizes": "48x48",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "1.0"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-72x72.png",
|
||||||
|
"sizes": "72x72",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "1.5"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-96x96.png",
|
||||||
|
"sizes": "96x96",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "2.0"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-144x144.png",
|
||||||
|
"sizes": "144x144",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "3.0"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "\/favicon\/android-icon-192x192.png",
|
||||||
|
"sizes": "192x192",
|
||||||
|
"type": "image\/png",
|
||||||
|
"density": "4.0"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
||||||
@@ -1 +0,0 @@
|
|||||||
/* /index.html 200
|
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
import { Pagination, PaginationItem } from "@/modules/common/components/pagination";
|
||||||
|
import { calcTotalPageNumber } from "@/modules/common/functions/pagination";
|
||||||
|
import { ArticleCard } from "@/modules/features/article/components/articleCard";
|
||||||
|
import { fetchFeedArticles } from "@/modules/features/article/fetch/fetchArticleList";
|
||||||
|
|
||||||
|
const Pages = ({ totalPages, currentPage }: { totalPages: number; currentPage: number }) => (
|
||||||
|
<Pagination>
|
||||||
|
{[...Array(totalPages)].map((_, index) => {
|
||||||
|
const page = index + 1;
|
||||||
|
const href = `/?tab=global&page=${page}`;
|
||||||
|
return (
|
||||||
|
<PaginationItem href={href} active={page === currentPage} key={index}>
|
||||||
|
{page}
|
||||||
|
</PaginationItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Pagination>
|
||||||
|
);
|
||||||
|
|
||||||
|
export const FeedArticleList = async ({ currentPage }: { currentPage: number }) => {
|
||||||
|
const { articles, articlesCount } = await fetchFeedArticles(currentPage);
|
||||||
|
const totalPages = calcTotalPageNumber(articlesCount, 10);
|
||||||
|
|
||||||
|
return articles.length < 1 ? (
|
||||||
|
<p>No articles found.</p>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
{articles.map((article, index) => (
|
||||||
|
<ArticleCard key={index} article={article} />
|
||||||
|
))}
|
||||||
|
{1 < totalPages && <Pages currentPage={currentPage} totalPages={totalPages} />}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./feedArticleList";
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
import { Pagination, PaginationItem } from "@/modules/common/components/pagination";
|
||||||
|
import { calcTotalPageNumber } from "@/modules/common/functions/pagination";
|
||||||
|
import { ArticleCard } from "@/modules/features/article/components/articleCard";
|
||||||
|
import { fetchGlobalArticles } from "@/modules/features/article/fetch/fetchArticleList";
|
||||||
|
|
||||||
|
const Pages = ({ totalPages, currentPage }: { totalPages: number; currentPage: number }) => (
|
||||||
|
<Pagination>
|
||||||
|
{[...Array(totalPages)].map((_, index) => {
|
||||||
|
const page = index + 1;
|
||||||
|
const href = `/?tab=global&page=${page}`;
|
||||||
|
return (
|
||||||
|
<PaginationItem href={href} active={page === currentPage} key={index}>
|
||||||
|
{page}
|
||||||
|
</PaginationItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Pagination>
|
||||||
|
);
|
||||||
|
|
||||||
|
export const GlobalArticleList = async ({ currentPage }: { currentPage: number }) => {
|
||||||
|
const { articles, articlesCount } = await fetchGlobalArticles(currentPage);
|
||||||
|
const totalPages = calcTotalPageNumber(articlesCount, 10);
|
||||||
|
|
||||||
|
return articles.length < 1 ? (
|
||||||
|
<p>No articles found.</p>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
{articles.map((article, index) => (
|
||||||
|
<ArticleCard key={index} article={article} />
|
||||||
|
))}
|
||||||
|
{1 < totalPages && <Pages currentPage={currentPage} totalPages={totalPages} />}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./globalArticleList";
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
export * from "./logoHeader";
|
||||||
|
export * from "./logoSmall";
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
const LogoHeader: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="272" height="60" viewBox="0 0 272 60">
|
||||||
|
<g id="Ad_Astra_3_">
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="82.246,32.325 80.22,24.75 67.628,24.75 65.604,32.325 " />
|
||||||
|
<polygon fill="#D7C067" points="78.265,47.726 79.182,51.349 87.329,51.349 82.955,35.167 74.905,35.167 76.599,41.509 71.25,41.509 72.944,35.166 64.795,35.167 60.519,51.349 68.62,51.349 69.587,47.726 " />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M115.256,32.325v-1.523c0-1.663-0.637-3.104-1.895-4.28c-1.258-1.176-2.797-1.773-4.575-1.773H89.241 v7.576H115.256z" />
|
||||||
|
<path fill="#D7C067" d="M115.256,35.167h-8.1v8.606h-9.814v-8.606h-8.101v16.182h19.544c1.779,0,3.318-0.596,4.575-1.772 c1.258-1.177,1.895-2.617,1.895-4.28V35.167z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="149.168,32.325 147.142,24.75 134.552,24.75 132.527,32.325 " />
|
||||||
|
<polygon fill="#D7C067" points="145.187,47.726 146.104,51.349 154.25,51.349 149.878,35.167 141.827,35.167 143.522,41.509 138.171,41.509 139.866,35.166 131.718,35.167 127.441,51.349 135.542,51.349 136.51,47.726 " />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M182.177,41.219c0-1.662-0.637-3.103-1.894-4.279c-1.257-1.177-2.797-1.773-4.576-1.773h-19.537 c0.07,1.543,0.704,2.885,1.888,3.992c1.257,1.175,2.797,1.771,4.576,1.771h11.444v2.843h-17.915v7.576h19.543 c1.779,0,3.319-0.596,4.576-1.772c1.256-1.177,1.894-2.617,1.894-4.28V41.219z" />
|
||||||
|
<path fill="#D7C067" d="M156.164,32.325h26.013V24.75h-19.542c-1.778,0-3.319,0.597-4.576,1.773 c-1.257,1.175-1.895,2.617-1.895,4.28V32.325z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="194.171" y="35.167" fill="#D7C067" width="8.101" height="16.182" />
|
||||||
|
<rect x="185.214" y="24.75" fill="#D7C067" width="26.015" height="7.576" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M240.278,32.325v-1.523c0-1.663-0.637-3.104-1.895-4.28c-1.259-1.176-2.798-1.773-4.576-1.773h-19.544 v7.576H240.278z" />
|
||||||
|
<path fill="#D7C067" d="M214.264,51.349h8.1V40.93h9.815v10.418h8.1V41.219c0-0.852-0.604-1.85-1.796-2.966l-0.219-0.204 l0.219-0.205c1.061-0.992,1.655-1.891,1.774-2.677h-25.992V51.349z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="259.936,47.726 260.854,51.349 269,51.349 264.627,35.167 256.577,35.167 258.272,41.509 252.92,41.509 254.616,35.166 246.466,35.167 242.189,51.349 250.291,51.349 251.26,47.726 " />
|
||||||
|
<polygon fill="#D7C067" points="263.916,32.325 261.893,24.75 249.301,24.75 247.275,32.325 " />
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g id="Star_1_">
|
||||||
|
<path fillRule="evenodd" clipRule="evenodd" fill="#DDDCDB" d="M83.315,18.245c-18.977-0.521-37.805,14.08-53.743,25.012 l6.676-20.473l2.715,7.387c0.54,1.35,1.15,1.016,2.676,0.347C56.554,23.297,63.892,15.637,83.315,18.245z" />
|
||||||
|
<path fill="#D7C067" d="M25.725,48.51l10.771-8.175l11.39,11.317l-11.007-6.955L19.927,57l5.516-21.621L3,23.726l27.347,8.99 L25.725,48.51z" />
|
||||||
|
<path fill="#D7C067" d="M31.53,28.94L8.308,22.501l20.681,1.383l3.331-10.934l2.55,6.38L31.53,28.94z" />
|
||||||
|
<path fill="#D7C067" d="M35.352,3l8.294,19.697c0.14,0.322,0.265,0.545,0.554,0.408C56.45,16.93,66.625,7.79,96.508,17.836 c-31.457-6.516-38.135,2.598-55.074,10.246c-0.337,0.14-0.624-0.113-0.914-0.832L33.412,9.368L35.352,3z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default LogoHeader;
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
const LogoSmall: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="218" height="48" viewBox="0 0 218 48">
|
||||||
|
<g id="Ad_Astra_3_">
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="66.158,26.352 64.543,20.319 54.508,20.319 52.896,26.352 " />
|
||||||
|
<polygon fill="#D7C067" points="62.985,38.615 63.716,41.5 70.209,41.5 66.724,28.614 60.308,28.614 61.658,33.665 57.394,33.665 58.745,28.614 52.25,28.614 48.842,41.5 55.299,41.5 56.069,38.615 " />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M92.467,26.352v-1.212c0-1.325-0.508-2.472-1.51-3.409c-1.003-0.937-2.23-1.412-3.647-1.412H71.733v6.033 H92.467z" />
|
||||||
|
<path fill="#D7C067" d="M92.467,28.614h-6.456v6.853H78.19v-6.853h-6.457V41.5H87.31c1.418,0,2.645-0.475,3.647-1.411 c1.002-0.938,1.51-2.083,1.51-3.409V28.614z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="119.495,26.352 117.88,20.319 107.846,20.319 106.232,26.352 " />
|
||||||
|
<polygon fill="#D7C067" points="116.322,38.615 117.053,41.5 123.546,41.5 120.061,28.614 113.644,28.614 114.995,33.665 110.73,33.665 112.081,28.614 105.588,28.614 102.179,41.5 108.635,41.5 109.406,38.615 " />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M145.803,33.434c0-1.324-0.508-2.471-1.509-3.408c-1.002-0.937-2.229-1.412-3.647-1.412h-15.571 c0.056,1.229,0.561,2.297,1.505,3.179c1.001,0.936,2.229,1.41,3.647,1.41h9.121v2.264H125.07V41.5h15.576 c1.418,0,2.645-0.475,3.647-1.411c1.001-0.938,1.509-2.083,1.509-3.409V33.434z" />
|
||||||
|
<path fill="#D7C067" d="M125.07,26.352h20.732v-6.033h-15.575c-1.417,0-2.646,0.475-3.647,1.412 c-1.002,0.936-1.51,2.084-1.51,3.409V26.352z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="155.362" y="28.614" fill="#D7C067" width="6.456" height="12.886" />
|
||||||
|
<rect x="148.223" y="20.319" fill="#D7C067" width="20.733" height="6.033" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#D7C067" d="M192.109,26.352v-1.212c0-1.325-0.508-2.472-1.51-3.409c-1.003-0.937-2.23-1.412-3.647-1.412h-15.576 v6.033H192.109z" />
|
||||||
|
<path fill="#D7C067" d="M171.375,41.5h6.456v-8.296h7.823V41.5h6.456v-8.066c0-0.679-0.481-1.473-1.432-2.362l-0.174-0.163 l0.174-0.163c0.846-0.79,1.319-1.506,1.414-2.132h-20.716V41.5z" />
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon fill="#D7C067" points="207.776,38.615 208.508,41.5 215,41.5 211.515,28.614 205.099,28.614 206.45,33.665 202.185,33.665 203.536,28.614 197.041,28.614 193.632,41.5 200.088,41.5 200.861,38.615 " />
|
||||||
|
<polygon fill="#D7C067" points="210.948,26.352 209.335,20.319 199.3,20.319 197.686,26.352 " />
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g id="Star_1_">
|
||||||
|
<path fillRule="evenodd" clipRule="evenodd" fill="#DDDCDB" d="M67.011,15.14c-15.125-0.415-30.13,11.212-42.833,19.917 l5.321-16.303l2.163,5.883c0.43,1.075,0.917,0.809,2.133,0.276C45.682,19.162,51.53,13.062,67.011,15.14z" />
|
||||||
|
<path fill="#D7C067" d="M21.111,39.24l8.584-6.51l9.078,9.012l-8.772-5.538L16.491,46l4.396-17.216L3,19.504l21.795,7.159 L21.111,39.24z" />
|
||||||
|
<path fill="#D7C067" d="M25.738,23.656L7.23,18.529l16.482,1.101l2.655-8.707l2.032,5.081L25.738,23.656z" />
|
||||||
|
<path fill="#D7C067" d="M28.784,3l6.61,15.685c0.112,0.257,0.211,0.435,0.442,0.326c9.763-4.918,17.872-12.196,41.689-4.196 c-25.071-5.188-30.394,2.068-43.894,8.159c-0.269,0.111-0.497-0.09-0.729-0.662L27.238,8.07L28.784,3z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default LogoSmall;
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./tagArticleList";
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
import { Pagination, PaginationItem } from "@/modules/common/components/pagination";
|
||||||
|
import { calcTotalPageNumber } from "@/modules/common/functions/pagination";
|
||||||
|
import { ArticleCard } from "@/modules/features/article/components/articleCard";
|
||||||
|
import { fetchArticlesByTag } from "@/modules/features/article/fetch/fetchArticleList";
|
||||||
|
|
||||||
|
const Pages = ({ totalPages, currentPage }: { totalPages: number; currentPage: number }) => (
|
||||||
|
<Pagination>
|
||||||
|
{[...Array(totalPages)].map((_, index) => {
|
||||||
|
const page = index + 1;
|
||||||
|
const href = `/?tab=global&page=${page}`;
|
||||||
|
return (
|
||||||
|
<PaginationItem href={href} active={page === currentPage} key={index}>
|
||||||
|
{page}
|
||||||
|
</PaginationItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Pagination>
|
||||||
|
);
|
||||||
|
|
||||||
|
export const TagArticleList = async ({ tag, currentPage }: { tag: string; currentPage: number }) => {
|
||||||
|
const { articles, articlesCount } = await fetchArticlesByTag(tag, currentPage);
|
||||||
|
const totalPages = calcTotalPageNumber(articlesCount, 10);
|
||||||
|
|
||||||
|
return articles.length < 1 ? (
|
||||||
|
<p>No articles found.</p>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
{articles.map((article, index) => (
|
||||||
|
<ArticleCard key={index} article={article} />
|
||||||
|
))}
|
||||||
|
{1 < totalPages && <Pages currentPage={currentPage} totalPages={totalPages} />}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
import { fetchTagsList } from "@/modules/features/article/fetch/fetchTagsList";
|
||||||
|
import { TagList as TagListPresentation } from "./presentation";
|
||||||
|
|
||||||
|
export const TagList = async () => {
|
||||||
|
const tags = await fetchTagsList();
|
||||||
|
return <TagListPresentation tags={tags} />;
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./container";
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import { Tag } from "@/modules/features/article/components/tag";
|
||||||
|
|
||||||
|
type Props = { tags: string[] };
|
||||||
|
|
||||||
|
export const TagList = ({ tags }: Props) => (
|
||||||
|
<div className="sidebar">
|
||||||
|
<p>Popular Tags</p>
|
||||||
|
<div className="tag-list">
|
||||||
|
{tags.map((tag, index) => (
|
||||||
|
<Tag component="a" variant="filled" href={`/?tab=tag&tag=${tag}`} key={index}>
|
||||||
|
{tag}
|
||||||
|
</Tag>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./timeClock";
|
||||||
@@ -0,0 +1,184 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import React, { useEffect } from "react";
|
||||||
|
|
||||||
|
const TimeClock: React.FC = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
const numbers = [
|
||||||
|
[1, 1, 1, 1, 1, 1, 0, 0, 0, 1, 1, 1, 1, 1, 1], // 0
|
||||||
|
[1, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 1], // 1
|
||||||
|
[1, 0, 1, 1, 1, 1, 0, 1, 0, 1, 1, 1, 1, 0, 1], // 2
|
||||||
|
[1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1], // 3
|
||||||
|
[1, 1, 1, 0, 0, 0, 0, 1, 0, 0, 1, 1, 1, 1, 1], // 4
|
||||||
|
[1, 1, 1, 0, 1, 1, 0, 1, 0, 1, 1, 0, 1, 1, 1], // 5
|
||||||
|
[1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 1, 0, 1, 1, 1], // 6
|
||||||
|
[1, 0, 0, 0, 0, 1, 0, 1, 1, 1, 1, 1, 0, 0, 0], // 7
|
||||||
|
[1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1], // 8
|
||||||
|
[1, 1, 1, 0, 1, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1], // 9
|
||||||
|
];
|
||||||
|
|
||||||
|
const blocks: Array<Element[]> = [];
|
||||||
|
const digits = Array.from(document.querySelectorAll(".block"));
|
||||||
|
|
||||||
|
for (let i = 0; i < 4; i++) {
|
||||||
|
blocks.push(digits.slice(i * 15, i * 15 + 15));
|
||||||
|
}
|
||||||
|
|
||||||
|
const setNum = (block: Array<Element>, num: number) => {
|
||||||
|
const n = numbers[num];
|
||||||
|
for (let i = 0; i < block.length; i++) {
|
||||||
|
block[i].classList[n[i] === 1 ? "add" : "remove"]("active");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const time = {
|
||||||
|
s: "",
|
||||||
|
m: "",
|
||||||
|
h: "",
|
||||||
|
p: 0,
|
||||||
|
};
|
||||||
|
|
||||||
|
// time loop
|
||||||
|
const animator = () => {
|
||||||
|
const d = new Date();
|
||||||
|
let h = d.getHours().toString(),
|
||||||
|
m = d.getMinutes().toString(),
|
||||||
|
s = d.getSeconds().toString();
|
||||||
|
|
||||||
|
s = s.length === 1 ? "0" + s : s;
|
||||||
|
m = m.length === 1 ? "0" + m : m;
|
||||||
|
h = h.length === 1 ? "0" + h : h;
|
||||||
|
|
||||||
|
if (s !== time.s) {
|
||||||
|
for (let i = 0; i < digits.length; i++) {
|
||||||
|
const d = digits[i];
|
||||||
|
if (i === +s) {
|
||||||
|
d.classList.add("second");
|
||||||
|
if (time.p !== null) digits[time.p].classList.remove("second");
|
||||||
|
time.p = i;
|
||||||
|
time.s = s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (m !== time.m) {
|
||||||
|
setNum(blocks[2], parseInt(Array.from(m)[0]));
|
||||||
|
setNum(blocks[3], parseInt(Array.from(m)[1]));
|
||||||
|
time.m = m;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (h !== time.h) {
|
||||||
|
setNum(blocks[0], parseInt(Array.from(h)[0]));
|
||||||
|
setNum(blocks[1], parseInt(Array.from(h)[1]));
|
||||||
|
time.h = h;
|
||||||
|
}
|
||||||
|
window.requestAnimationFrame(animator);
|
||||||
|
};
|
||||||
|
|
||||||
|
// init
|
||||||
|
window.requestAnimationFrame(animator);
|
||||||
|
|
||||||
|
// toggle button
|
||||||
|
const d = new Date();
|
||||||
|
const days = ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
|
||||||
|
const months = [
|
||||||
|
"Janvier",
|
||||||
|
"Février",
|
||||||
|
"Mars",
|
||||||
|
"Avril",
|
||||||
|
"Mai",
|
||||||
|
"Juin",
|
||||||
|
"Juillet",
|
||||||
|
"Août",
|
||||||
|
"Septembre",
|
||||||
|
"Octobre",
|
||||||
|
"Novembre",
|
||||||
|
"Décembre",
|
||||||
|
];
|
||||||
|
const lib_d = days[d.getDay()];
|
||||||
|
const lib_m = months[d.getMonth()];
|
||||||
|
const lib_n = d.getDate();
|
||||||
|
const lib_y = d.getFullYear();
|
||||||
|
document.getElementById("datelib")!.innerHTML = lib_d + " " + lib_n + " " + lib_m + " " + lib_y;
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="date d-flex mb-2 pt-2">
|
||||||
|
<div className="flex-grow-1"></div>
|
||||||
|
<div className="datelib mt-2 pt-1 ps-1 font-monospace fs-5">
|
||||||
|
<span className="icon-calendar me-2" aria-hidden="true"></span>
|
||||||
|
<span id="datelib"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="time d-flex">
|
||||||
|
<div className="flex-grow-1"></div>
|
||||||
|
<div className="clock position-relative d-flex flex-column flex-wrap">
|
||||||
|
<div className="block" data-num="0"></div>
|
||||||
|
<div className="block" data-num="1"></div>
|
||||||
|
<div className="block" data-num="2"></div>
|
||||||
|
<div className="block" data-num="3"></div>
|
||||||
|
<div className="block" data-num="4"></div>
|
||||||
|
<div className="block" data-num="5"></div>
|
||||||
|
<div className="block" data-num="6"></div>
|
||||||
|
<div className="block" data-num="7"></div>
|
||||||
|
<div className="block" data-num="8"></div>
|
||||||
|
<div className="block" data-num="9"></div>
|
||||||
|
<div className="block" data-num="10"></div>
|
||||||
|
<div className="block" data-num="11"></div>
|
||||||
|
<div className="block" data-num="12"></div>
|
||||||
|
<div className="block" data-num="13"></div>
|
||||||
|
<div className="block" data-num="14"></div>
|
||||||
|
<div className="block" data-num="15"></div>
|
||||||
|
<div className="block" data-num="16"></div>
|
||||||
|
<div className="block" data-num="17"></div>
|
||||||
|
<div className="block" data-num="18"></div>
|
||||||
|
<div className="block" data-num="19"></div>
|
||||||
|
<div className="block" data-num="20"></div>
|
||||||
|
<div className="block" data-num="21"></div>
|
||||||
|
<div className="block" data-num="22"></div>
|
||||||
|
<div className="block" data-num="23"></div>
|
||||||
|
<div className="block" data-num="24"></div>
|
||||||
|
<div className="block" data-num="25"></div>
|
||||||
|
<div className="block" data-num="26"></div>
|
||||||
|
<div className="block" data-num="27"></div>
|
||||||
|
<div className="block" data-num="28"></div>
|
||||||
|
<div className="block" data-num="29"></div>
|
||||||
|
<div className="block" data-num="30"></div>
|
||||||
|
<div className="block" data-num="31"></div>
|
||||||
|
<div className="block" data-num="32"></div>
|
||||||
|
<div className="block" data-num="33"></div>
|
||||||
|
<div className="block" data-num="34"></div>
|
||||||
|
<div className="block" data-num="35"></div>
|
||||||
|
<div className="block" data-num="36"></div>
|
||||||
|
<div className="block" data-num="37"></div>
|
||||||
|
<div className="block" data-num="38"></div>
|
||||||
|
<div className="block" data-num="39"></div>
|
||||||
|
<div className="block" data-num="40"></div>
|
||||||
|
<div className="block" data-num="41"></div>
|
||||||
|
<div className="block" data-num="42"></div>
|
||||||
|
<div className="block" data-num="43"></div>
|
||||||
|
<div className="block" data-num="44"></div>
|
||||||
|
<div className="block" data-num="45"></div>
|
||||||
|
<div className="block" data-num="46"></div>
|
||||||
|
<div className="block" data-num="47"></div>
|
||||||
|
<div className="block" data-num="48"></div>
|
||||||
|
<div className="block" data-num="49"></div>
|
||||||
|
<div className="block" data-num="50"></div>
|
||||||
|
<div className="block" data-num="51"></div>
|
||||||
|
<div className="block" data-num="52"></div>
|
||||||
|
<div className="block" data-num="53"></div>
|
||||||
|
<div className="block" data-num="54"></div>
|
||||||
|
<div className="block" data-num="55"></div>
|
||||||
|
<div className="block" data-num="56"></div>
|
||||||
|
<div className="block" data-num="57"></div>
|
||||||
|
<div className="block" data-num="58"></div>
|
||||||
|
<div className="block" data-num="59"></div>
|
||||||
|
<div className="divider position-absolute"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default TimeClock;
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { z } from "zod";
|
||||||
|
|
||||||
|
export const SearchParams = z.object({
|
||||||
|
page: z.coerce.number().int().min(1).catch(1),
|
||||||
|
tab: z.enum(["yours", "global", "tag"]).default("global"),
|
||||||
|
tag: z.string().optional(),
|
||||||
|
});
|
||||||
|
|
||||||
|
export type SearchParams = z.infer<typeof SearchParams>;
|
||||||
@@ -1 +0,0 @@
|
|||||||
<app-full-layout [class]="appClass"></app-full-layout>
|
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
.grayscale {
|
|
||||||
filter: grayscale(1);
|
|
||||||
transition: all 2s ease;
|
|
||||||
}
|
|
||||||
.colored {
|
|
||||||
filter: grayscale(0);
|
|
||||||
transition: all 5s ease;
|
|
||||||
}
|
|
||||||
@@ -1,29 +0,0 @@
|
|||||||
import { TestBed } from '@angular/core/testing';
|
|
||||||
import { AppComponent } from './app.component';
|
|
||||||
|
|
||||||
describe('AppComponent', () => {
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [AppComponent],
|
|
||||||
}).compileComponents();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create the app', () => {
|
|
||||||
const fixture = TestBed.createComponent(AppComponent);
|
|
||||||
const app = fixture.componentInstance;
|
|
||||||
expect(app).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
it(`should have the 'adastra_angular' title`, () => {
|
|
||||||
const fixture = TestBed.createComponent(AppComponent);
|
|
||||||
const app = fixture.componentInstance;
|
|
||||||
expect(app.title).toEqual('adastra_angular');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should render title', () => {
|
|
||||||
const fixture = TestBed.createComponent(AppComponent);
|
|
||||||
fixture.detectChanges();
|
|
||||||
const compiled = fixture.nativeElement as HTMLElement;
|
|
||||||
expect(compiled.querySelector('h1')?.textContent).toContain('Hello, adastra_angular');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@@ -1,48 +0,0 @@
|
|||||||
import { Component, OnInit, AfterContentInit } from '@angular/core';
|
|
||||||
import { MAT_DATE_LOCALE, MAT_DATE_FORMATS, provideNativeDateAdapter } from '@angular/material/core';
|
|
||||||
import { Title } from '@angular/platform-browser';
|
|
||||||
|
|
||||||
import { FullComponent } from '@components/shared/layout';
|
|
||||||
import { UserService } from "@services";
|
|
||||||
|
|
||||||
export const MY_FORMATS = {
|
|
||||||
parse: {
|
|
||||||
dateInput: 'DD/MM/YYYY',
|
|
||||||
},
|
|
||||||
display: {
|
|
||||||
dateInput: 'DD/MM/YYYY',
|
|
||||||
monthYearLabel: 'MMM YYYY',
|
|
||||||
dateA11yLabel: 'LL',
|
|
||||||
monthYearA11yLabel: 'MMMM-YYYY',
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-root',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
FullComponent
|
|
||||||
],
|
|
||||||
providers: [
|
|
||||||
{ provide: MAT_DATE_LOCALE, useValue: 'fr-FR' },
|
|
||||||
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
|
|
||||||
provideNativeDateAdapter(MY_FORMATS)
|
|
||||||
],
|
|
||||||
templateUrl: './app.component.html',
|
|
||||||
styleUrl: './app.component.scss'
|
|
||||||
})
|
|
||||||
export class AppComponent implements OnInit, AfterContentInit {
|
|
||||||
public title = 'Ad Astra';
|
|
||||||
public appClass = 'grayscale';
|
|
||||||
|
|
||||||
constructor(private userService: UserService, private titleService: Title) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.userService.populate();
|
|
||||||
this.titleService.setTitle(this.title);
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
this.appClass = 'colored';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,40 +0,0 @@
|
|||||||
import { APP_INITIALIZER, ApplicationConfig, LOCALE_ID } from '@angular/core';
|
|
||||||
import { Title } from '@angular/platform-browser';
|
|
||||||
//import { provideRouter, withComponentInputBinding, withDebugTracing } from '@angular/router';
|
|
||||||
import { provideRouter, withViewTransitions } from '@angular/router';
|
|
||||||
import { provideAnimations } from '@angular/platform-browser/animations';
|
|
||||||
import { provideHttpClient, withInterceptors } from '@angular/common/http';
|
|
||||||
import { registerLocaleData } from '@angular/common';
|
|
||||||
import localeFr from '@angular/common/locales/fr';
|
|
||||||
import { provideCharts, withDefaultRegisterables } from 'ng2-charts';
|
|
||||||
import { EMPTY } from "rxjs";
|
|
||||||
|
|
||||||
registerLocaleData(localeFr);
|
|
||||||
|
|
||||||
import { routes } from './app.routes';
|
|
||||||
import { apiInterceptor, tokenInterceptor, errorInterceptor } from "@interceptors";
|
|
||||||
import { JwtService, UserService } from "@services";
|
|
||||||
|
|
||||||
export function initAuth(jwtService: JwtService, userService: UserService) {
|
|
||||||
return () => (jwtService.getToken() ? userService.getCurrentUser() : EMPTY);
|
|
||||||
}
|
|
||||||
|
|
||||||
export const appConfig: ApplicationConfig = {
|
|
||||||
providers: [
|
|
||||||
//provideRouter(routes, withComponentInputBinding(), withDebugTracing()),
|
|
||||||
provideRouter(routes, withViewTransitions()),
|
|
||||||
provideHttpClient(
|
|
||||||
withInterceptors([apiInterceptor, tokenInterceptor, errorInterceptor])
|
|
||||||
),
|
|
||||||
provideAnimations(),
|
|
||||||
provideCharts(withDefaultRegisterables()),
|
|
||||||
Title,
|
|
||||||
{ provide: LOCALE_ID, useValue: 'fr-FR' },
|
|
||||||
{
|
|
||||||
provide: APP_INITIALIZER,
|
|
||||||
useFactory: initAuth,
|
|
||||||
deps: [JwtService, UserService],
|
|
||||||
multi: true,
|
|
||||||
}
|
|
||||||
]
|
|
||||||
};
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
import { Routes } from '@angular/router';
|
|
||||||
|
|
||||||
import { AUTH_ROUTES, NOAUTH_ROUTES } from 'src/app/routes';
|
|
||||||
|
|
||||||
export const routes: Routes = [ ...AUTH_ROUTES, ...NOAUTH_ROUTES];
|
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
.actions {
|
||||||
|
& * + * {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn + .action-btn {
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
@@ -0,0 +1,80 @@
|
|||||||
|
import { Container, Col, Row } from "react-bootstrap";
|
||||||
|
import { Button } from "@/modules/common/components/button";
|
||||||
|
import { DeleteArticleButton } from "@/modules/features/article/components/deleteArticleButton";
|
||||||
|
import { FavoriteButton } from "@/modules/features/article/components/favoriteButton";
|
||||||
|
import { Tag } from "@/modules/features/article/components/tag";
|
||||||
|
import { fetchArticle } from "@/modules/features/article/fetch/fetchArticle";
|
||||||
|
import { convertMarkdownToHtml } from "@/modules/features/article/functions";
|
||||||
|
import { FollowButton } from "@/modules/features/profile/components/followButton";
|
||||||
|
import { Article, User } from "@/utils/types/models";
|
||||||
|
import Link from "next/link";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { ReactNode } from "react";
|
||||||
|
import styles from "./articleArea.module.css";
|
||||||
|
import { showDeleteArticleButton, showEditArticleButton, showFollowButton } from "./functions";
|
||||||
|
import { getSession } from "@/utils/auth/session";
|
||||||
|
import { fetchCurrentUser } from "@/modules/features/auth/fetch/fetchCurrentUser";
|
||||||
|
|
||||||
|
const Actions = ({ article, currentUser }: { article: Article; currentUser?: User }) => {
|
||||||
|
const profile = article.author;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="article-meta">
|
||||||
|
<Link href={`/profile/${profile.username}`}>{profile.image && <Image src={profile.image} alt="" />}</Link>
|
||||||
|
<div className="info">
|
||||||
|
<Link href={`/profile/${profile.username}`} className="author">
|
||||||
|
{profile.username}
|
||||||
|
</Link>
|
||||||
|
<span className="date">{article.createdAt.toDateString()}</span>
|
||||||
|
</div>
|
||||||
|
{showFollowButton(profile.username, currentUser) && (
|
||||||
|
<FollowButton {...profile} className={styles["action-btn"]} />
|
||||||
|
)}
|
||||||
|
<FavoriteButton {...article} showMessage={true} className={styles["action-btn"]} />
|
||||||
|
{showEditArticleButton(profile.username, currentUser) && (
|
||||||
|
<Button component="a" href={`/editor/${article.slug}`} color="secondary" className={styles["action-btn"]}>
|
||||||
|
<i className="ion-edit"></i> Edit Article
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
{showDeleteArticleButton(profile.username, currentUser) && (
|
||||||
|
<DeleteArticleButton slug={article.slug} className={styles["action-btn"]} />
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const ArticleArea = async ({ slug, children }: { slug: string; children: ReactNode }) => {
|
||||||
|
const article = await fetchArticle(slug);
|
||||||
|
const body = await convertMarkdownToHtml(article.body);
|
||||||
|
const currentUser = (await getSession()) ? await fetchCurrentUser() : undefined;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className="article-page">
|
||||||
|
<Container className="banner">
|
||||||
|
<h1>{article.title}</h1>
|
||||||
|
<Actions article={article} currentUser={currentUser} />
|
||||||
|
</Container>
|
||||||
|
<Container className="page">
|
||||||
|
<Row className="article-content">
|
||||||
|
<Col xs={12}>
|
||||||
|
<div dangerouslySetInnerHTML={{ __html: body }} />
|
||||||
|
<ul className="list-unstyled list-inline">
|
||||||
|
{article.tagList.map((tag, index) => (
|
||||||
|
<li className="list-inline-item me-2" key={index}>
|
||||||
|
<Tag component="badge" color="success">
|
||||||
|
{tag}
|
||||||
|
</Tag>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<hr />
|
||||||
|
<div className="article-actions">
|
||||||
|
<Actions article={article} currentUser={currentUser} />
|
||||||
|
</div>
|
||||||
|
{children}
|
||||||
|
</Container>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
import { User } from "@/utils/types/models";
|
||||||
|
|
||||||
|
export const showFollowButton = (authorUsername: string, currentUser: User | undefined) => {
|
||||||
|
return authorUsername !== currentUser?.username;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const showEditArticleButton = (authorUsername: string, currentUser: User | undefined) => {
|
||||||
|
return authorUsername === currentUser?.username;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const showDeleteArticleButton = (authorUsername: string, currentUser: User | undefined) => {
|
||||||
|
return authorUsername === currentUser?.username;
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./articleArea";
|
||||||
@@ -0,0 +1,30 @@
|
|||||||
|
"use server";
|
||||||
|
|
||||||
|
import { createApiClient } from "@/utils/api/apiClient";
|
||||||
|
import { getSession } from "@/utils/auth/session";
|
||||||
|
import { revalidateTag } from "next/cache";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
import { Inputs } from "./types";
|
||||||
|
|
||||||
|
export const deleteCommentAction = async (_prevState: undefined, inputs: Inputs): Promise<undefined> => {
|
||||||
|
if ((await getSession()) == null) {
|
||||||
|
redirect("/login");
|
||||||
|
}
|
||||||
|
|
||||||
|
const apiClient = createApiClient({
|
||||||
|
path: "/articles/{slug}/comments/{id}",
|
||||||
|
method: "delete",
|
||||||
|
params: {
|
||||||
|
path: inputs,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const response = await apiClient.sendRequest();
|
||||||
|
|
||||||
|
if (response.result === "success") {
|
||||||
|
revalidateTag("");
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
throw new Error("api error");
|
||||||
|
};
|
||||||
@@ -0,0 +1,36 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { Comment, User } from "@/utils/types/models";
|
||||||
|
import { use, useActionState } from "react";
|
||||||
|
import { deleteCommentAction as serverAction } from "./action";
|
||||||
|
import { CommentCard as CommentCardPresentation } from "./presentation";
|
||||||
|
import { showDeleteCommentButton } from "./functions";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
slug: string;
|
||||||
|
comment: Comment;
|
||||||
|
currentUserPromise?: Promise<User>;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const CommentCard = ({ slug, comment, currentUserPromise }: Props) => {
|
||||||
|
const [_state, dispatch, isPending] = useActionState(serverAction, undefined);
|
||||||
|
|
||||||
|
const action = () => {
|
||||||
|
if (!confirm("Delete comment?")) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
dispatch({ slug, id: comment.id });
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<CommentCardPresentation
|
||||||
|
comment={comment}
|
||||||
|
showDeleteCommentButton={showDeleteCommentButton(
|
||||||
|
comment.author.username,
|
||||||
|
currentUserPromise && use(currentUserPromise),
|
||||||
|
)}
|
||||||
|
deleteCommentAction={action}
|
||||||
|
isPending={isPending}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1,5 @@
|
|||||||
|
import { User } from "@/utils/types/models";
|
||||||
|
|
||||||
|
export const showDeleteCommentButton = (commentAuthorUsername: string, currentUser?: User) => {
|
||||||
|
return commentAuthorUsername === currentUser?.username;
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./container";
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
.form {
|
||||||
|
display: inline;
|
||||||
|
|
||||||
|
& button {
|
||||||
|
background: none;
|
||||||
|
color: inherit;
|
||||||
|
border: none;
|
||||||
|
padding: 0;
|
||||||
|
font: inherit;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
import { Button, Form } from "react-bootstrap";
|
||||||
|
import Link from "next/link";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { Comment } from "@/utils/types/models";
|
||||||
|
import styles from "./presentation.module.css";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
comment: Comment;
|
||||||
|
showDeleteCommentButton?: boolean;
|
||||||
|
deleteCommentAction?: () => void;
|
||||||
|
isPending?: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const CommentCard = ({ comment, showDeleteCommentButton, deleteCommentAction }: Props) => {
|
||||||
|
return (
|
||||||
|
<div className="card">
|
||||||
|
<div className="card-block">
|
||||||
|
<p className="card-text">{comment.body}</p>
|
||||||
|
</div>
|
||||||
|
<div className="card-footer">
|
||||||
|
<Link href={`/profile/${comment.author.username}`} className="comment-author">
|
||||||
|
{comment.author.image && <Image src={comment.author.image} className="comment-author-img" alt="" />}
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link href={`/profile/${comment.author.username}`} className="comment-author">
|
||||||
|
{comment.author.username}
|
||||||
|
</Link>
|
||||||
|
<span className="date-posted">{comment.createdAt.toDateString()}</span>
|
||||||
|
{showDeleteCommentButton && (
|
||||||
|
<Form action={deleteCommentAction} className={styles["form"]}>
|
||||||
|
<Button className="mod-options" variant="primary" type="submit">
|
||||||
|
<i className="icon-trash" />
|
||||||
|
</Button>
|
||||||
|
</Form>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
export type Inputs = {
|
||||||
|
slug: string;
|
||||||
|
id: string;
|
||||||
|
};
|
||||||
@@ -0,0 +1,57 @@
|
|||||||
|
"use server";
|
||||||
|
|
||||||
|
import { createApiClient } from "@/utils/api/apiClient";
|
||||||
|
import { getSession } from "@/utils/auth/session";
|
||||||
|
import { SubmissionResult } from "@conform-to/react";
|
||||||
|
import { parseWithZod } from "@conform-to/zod";
|
||||||
|
import { revalidateTag } from "next/cache";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
import { inputsSchema } from "./types";
|
||||||
|
|
||||||
|
export const postCommentAction = async (
|
||||||
|
_prevState: unknown,
|
||||||
|
formData: FormData,
|
||||||
|
): Promise<SubmissionResult<string[]>> => {
|
||||||
|
if ((await getSession()) == null) {
|
||||||
|
redirect("/login");
|
||||||
|
}
|
||||||
|
|
||||||
|
const submission = parseWithZod(formData, { schema: inputsSchema });
|
||||||
|
|
||||||
|
if (submission.status !== "success") {
|
||||||
|
return submission.reply();
|
||||||
|
}
|
||||||
|
|
||||||
|
const { slug, body } = submission.value;
|
||||||
|
|
||||||
|
const apiClient = createApiClient({
|
||||||
|
path: "/articles/{slug}/comments",
|
||||||
|
method: "post",
|
||||||
|
params: {
|
||||||
|
path: {
|
||||||
|
slug,
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
comment: {
|
||||||
|
body,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const response = await apiClient.sendRequest();
|
||||||
|
|
||||||
|
if (response.result === "success") {
|
||||||
|
revalidateTag("");
|
||||||
|
return submission.reply();
|
||||||
|
}
|
||||||
|
|
||||||
|
switch (response.statusCode) {
|
||||||
|
case 422:
|
||||||
|
return submission.reply({
|
||||||
|
formErrors: Object.values(response.error.errors).flat(),
|
||||||
|
});
|
||||||
|
default:
|
||||||
|
throw new Error("api error");
|
||||||
|
}
|
||||||
|
};
|
||||||
@@ -0,0 +1,26 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { User } from "@/utils/types/models";
|
||||||
|
import { use, useActionState } from "react";
|
||||||
|
import { postCommentAction } from "./action";
|
||||||
|
import { CommentForm as CommentFormPresentation } from "./presentation";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
slug: string;
|
||||||
|
currentUserPromise?: Promise<User>;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const CommentForm = ({ slug, currentUserPromise }: Props) => {
|
||||||
|
const currentUser = currentUserPromise && use(currentUserPromise);
|
||||||
|
const [state, action, isPending] = useActionState(postCommentAction, undefined);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<CommentFormPresentation
|
||||||
|
slug={slug}
|
||||||
|
authorImage={currentUser?.image}
|
||||||
|
result={state}
|
||||||
|
postCommentAction={action}
|
||||||
|
isPending={isPending}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./container";
|
||||||
@@ -0,0 +1,68 @@
|
|||||||
|
import { Button, Form } from "react-bootstrap";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { ErrorMessage } from "@/modules/common/components/errorMessage";
|
||||||
|
import { SubmissionResult, useForm } from "@conform-to/react";
|
||||||
|
import { parseWithZod } from "@conform-to/zod";
|
||||||
|
import { startTransition } from "react";
|
||||||
|
import { inputsSchema } from "./types";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
slug?: string;
|
||||||
|
authorImage?: string;
|
||||||
|
result?: SubmissionResult<string[]>;
|
||||||
|
postCommentAction?: (formData: FormData) => void;
|
||||||
|
isPending?: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const CommentForm = ({ slug, authorImage, result, postCommentAction, isPending }: Props) => {
|
||||||
|
const [form, fields] = useForm({
|
||||||
|
defaultValue: {
|
||||||
|
slug,
|
||||||
|
},
|
||||||
|
lastResult: result,
|
||||||
|
onValidate({ formData }) {
|
||||||
|
return parseWithZod(formData, { schema: inputsSchema });
|
||||||
|
},
|
||||||
|
// onSubmit is defined to avoid resetting form after successful submission
|
||||||
|
// see https://github.com/edmundhung/conform/discussions/606
|
||||||
|
onSubmit(event, { formData }) {
|
||||||
|
event.preventDefault();
|
||||||
|
startTransition(() => {
|
||||||
|
postCommentAction?.(formData);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
shouldRevalidate: "onBlur",
|
||||||
|
});
|
||||||
|
|
||||||
|
const errors = Object.values(form.allErrors).flat();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form className="card comment-form" id={form.id} action={postCommentAction} onSubmit={form.onSubmit} noValidate={true}>
|
||||||
|
<Form.Control
|
||||||
|
type="hidden"
|
||||||
|
key={fields.slug.key}
|
||||||
|
name={fields.slug.name}
|
||||||
|
defaultValue={fields.slug.initialValue}
|
||||||
|
/>
|
||||||
|
<div className="card-block">
|
||||||
|
<textarea
|
||||||
|
key={fields.body.key}
|
||||||
|
name={fields.body.name}
|
||||||
|
defaultValue={fields.body.initialValue}
|
||||||
|
placeholder="Write a comment..."
|
||||||
|
rows={3}
|
||||||
|
className="form-control"
|
||||||
|
></textarea>
|
||||||
|
<ErrorMessage messages={errors} />
|
||||||
|
</div>
|
||||||
|
<div className="card-footer">
|
||||||
|
{authorImage && <Image src={authorImage} alt="" className="comment-author-img" />}
|
||||||
|
<Button variant="primary" type="submit" disabled={isPending}>
|
||||||
|
Post Comment
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Form>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
import { z } from "zod";
|
||||||
|
|
||||||
|
export const inputsSchema = z.object({
|
||||||
|
slug: z.string().max(200),
|
||||||
|
body: z.string().max(200),
|
||||||
|
});
|
||||||
|
|
||||||
|
export type Inputs = z.infer<typeof inputsSchema>;
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
import { fetchComments } from "@/modules/features/article/fetch/fetchComments";
|
||||||
|
import { fetchCurrentUser } from "@/modules/features/auth/fetch/fetchCurrentUser";
|
||||||
|
import { getSession } from "@/utils/auth/session";
|
||||||
|
import { CommentCard } from "../commentCard";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
slug: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const CommentList = async ({ slug }: Props) => {
|
||||||
|
const comments = await fetchComments(slug);
|
||||||
|
const currentUserPromise = (await getSession()) ? fetchCurrentUser() : undefined;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{comments.map((comment, index) => (
|
||||||
|
<CommentCard key={index} slug={slug} comment={comment} currentUserPromise={currentUserPromise} />
|
||||||
|
))}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./commentList";
|
||||||
@@ -0,0 +1,31 @@
|
|||||||
|
import { Col, Row } from "react-bootstrap";
|
||||||
|
import { Suspense } from "react";
|
||||||
|
import { fetchCurrentUser } from "@/modules/features/auth/fetch/fetchCurrentUser";
|
||||||
|
import { getSession } from "@/utils/auth/session";
|
||||||
|
import { ArticleArea } from "./_components/articleArea";
|
||||||
|
import { CommentForm } from "./_components/commentForm";
|
||||||
|
import { CommentList } from "./_components/commentList";
|
||||||
|
|
||||||
|
type Params = Promise<{
|
||||||
|
slug: string;
|
||||||
|
}>;
|
||||||
|
|
||||||
|
const Page = async (props: { params: Params }) => {
|
||||||
|
const currentUserPromise = (await getSession()) ? fetchCurrentUser() : undefined;
|
||||||
|
const params = await props.params;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ArticleArea slug={params.slug}>
|
||||||
|
<Row>
|
||||||
|
<Col xs={12} md={{ span: 8, offset: 2 }}>
|
||||||
|
<CommentForm slug={params.slug} currentUserPromise={currentUserPromise} />
|
||||||
|
<Suspense fallback={<p>⌛Loading comments...</p>}>
|
||||||
|
<CommentList slug={params.slug} />
|
||||||
|
</Suspense>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</ArticleArea>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Page;
|
||||||