diapal-panel/Readme.md

Dipal admin panel

Table of Contents

• Dipal admin panel
• Overview
  • Technologies
• Getting Started
  • Development
    • Simple Start
    • Start with Docker
  • Production
    • Simple Build
    • Build with Docker
• Todo List
• Naming Convetions

Overview

Dipal admin panel is a demo project for main admin panel of the dipal.

Technologies

• language: Typescript
• framework: React
• api state management: SWR
• testing tools: Jest | React Testing Library
• lintins: ESlint
• module bundler: Vite
• HTTP client: Axios
• css framework: Tailwindcss

Getting Started

you can start this project in two ways: running simple, running with Docker

Development

Simple Start

1. define your resource server OIDC's static data as environment variable in .env.development. in this file you should define client id, client secret, realm and resource server base url

 yarn dev / npm run dev

Start with Docker

1. at first you should define four environment variable such as following variables in .env.development like following example:

• VITE_API_ORIGIN = https://admin.dev.dipal.ru/api/v1
• VITE_API_AUTH_ORIGIN = https://auth.dev.dipal.ru/api/v1/auth
• VITE_API_AUTH_PHONENUMBER = /start-challenge
• VITE_API_AUTH_LOGIN = /login
• VITE_API_AUTH_REFRESH = /refresh-token
• VITE_API_CREATE_MEMBER = /user_place/members
• VITE_API_PLACES = /place
• VITE_API_USERS = /profile
• VITE_API_USERS_ACCOUNT = /account
• VITE_API_USERS_PROFILE = /profile
• VITE_API_QR = /qr_code

for running with docker-compose, you can set these environment variable in docker-compose file and in the args.

  docker-compose -f docker-compose.yml up [-d] [--build] [--foce-recreate]

Production

Simple Build

1. define your resource server OIDC's static data as environment variable in .env.production. in this file you should define client id, client secret, realm and resource server base url

yarn build

for running the built project in your local you can use following commands after building.

npm i -g serve
serve dist

Build with Docker

1. at first you should define four environment variable such as following variables in .env.production like following example:

• VITE_API_ORIGIN = https://admin.dev.dipal.ru/api/v1
• VITE_API_AUTH_ORIGIN = https://auth.dev.dipal.ru/api/v1/auth
• VITE_API_AUTH_PHONENUMBER = /start-challenge
• VITE_API_AUTH_LOGIN = /login
• VITE_API_AUTH_REFRESH = /refresh-token
• VITE_API_CREATE_MEMBER = /user_place/members
• VITE_API_PLACES = /place
• VITE_API_USERS = /profile
• VITE_API_USERS_ACCOUNT = /account
• VITE_API_USERS_PROFILE = /profile
• VITE_API_QR = /qr_code

for running with docker-compose, you can set these environment variable in docker-compose file in the args.

  docker-compose -f docker-compose.prod.yml up [-d] [--build] [--foce-recreate]

Todo List

• project follows the hexagonal architecture for this architecture some of the features didn't follow the architecture rules we should seperate the logic from the other layers
• make full documentation for describing the full documentation
• strategy for intercepting the requests should be refactored to follow more clean and more reusable way handle all of the access token and refresh tokens in the interceptors
• we can use other strategies for error handling on getting the places list and users lists for requesting the api
• handling pagination or lazy loading for the tables
• use stale strategies for the api statemanager

naming convetions:

1. all folders follow the kebab-case convention for naming.
2. all files follow the camelCase convention for naming.
3. all variables and functions follow the camelCase convention for naming.