[DOP-20131] Initialize repo

MobileTeleSystems · Sep 30, 2024 · b36de9d · b36de9d
1 parent ae507d5
commit b36de9d
Show file tree

Hide file tree

Showing 27 changed files with 8,360 additions and 3 deletions.
diff --git a/.github/workflows/linters.yml b/.github/workflows/linters.yml
@@ -0,0 +1,43 @@
+name: Code analysis
+
+on:
+    push:
+        branches:
+            - develop
+    pull_request:
+        branches-ignore:
+            - master
+    workflow_dispatch:
+
+concurrency:
+    group: ${{ github.workflow }}-${{ github.head_ref || github.ref }}
+    cancel-in-progress: true
+
+jobs:
+    linters:
+        runs-on: ubuntu-latest
+        steps:
+            - uses: actions/checkout@v2
+            - name: Install modules
+              run: npm ci
+
+            - name: Cache modules
+              uses: actions/cache@v4
+              with:
+                  path: ./node_modules
+                  key: ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}
+                  restore-keys: |
+                      ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}
+                      ${{ runner.os }}-npm-
+
+            - name: Run Type check
+              run: npm run type-check
+
+            - name: Run ESLint
+              run: npx eslint
+
+            - name: Run Prettier
+              run: npx prettier --check
+
+            - name: Build project
+              run: npm run build
diff --git a/.gitignore b/.gitignore
@@ -7,7 +7,7 @@
 /coverage
 
 # production
-/build
+/dist
 
 # misc
 .DS_Store
@@ -18,5 +18,3 @@
 .eslintcache
 
 npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -0,0 +1 @@
+npx lint-staged
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,5 @@
+{
+    "tabWidth": 4,
+    "useTabs": false,
+    "printWidth": 80
+}
diff --git a/README.md b/README.md
@@ -3,3 +3,40 @@
 [![Project Status: Concept – Minimal or no implementation has been done yet, or the repository is only intended to be a limited example, demo, or proof-of-concept.](https://www.repostatus.org/badges/latest/concept.svg)](https://www.repostatus.org/#concept)
 
 UI for DataRentgen.
+
+## Development
+
+To explore the source code, start with [src/App.tsx](./src/App.tsx).
+
+### How to run
+
+After having cloned the Rentgen repository, run the following commands at the root directory:
+
+```bash
+npm install
+npm run dev
+```
+
+These commands will install dependencies and launch the dev server, by going to localhost:3000 you can go to the Rentgen UI interface.
+
+### How to format code
+
+Run the following command at the root directory:
+
+```bash
+npm run prettier-format
+```
+
+### How to run linters
+
+Run the following command at the root directory:
+
+```bash
+npx eslint --fix
+```
+
+### How to install pre-commit hooks
+
+```bash
+npm run pre-commit-install
+```
diff --git a/index.html b/index.html
@@ -0,0 +1,114 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <meta
+            name="viewport"
+            content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
+        />
+        <meta name="theme-color" content="#000000" />
+        <link rel="manifest" href="./manifest.json" />
+        <link rel="shortcut icon" href="./favicon.ico" />
+        <title>DataRentgen</title>
+        <style>
+            .loader-container {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                flex-direction: column;
+                position: absolute;
+                top: 0;
+                bottom: 0;
+                left: 0;
+                right: 0;
+                background-color: #fafafa;
+            }
+
+            /* CSS Spinner from https://projects.lukehaas.me/css-loaders/ */
+
+            .loader,
+            .loader:before,
+            .loader:after {
+                border-radius: 50%;
+            }
+
+            .loader {
+                color: #283593;
+                font-size: 11px;
+                text-indent: -99999em;
+                margin: 55px auto;
+                position: relative;
+                width: 10em;
+                height: 10em;
+                box-shadow: inset 0 0 0 1em;
+                -webkit-transform: translateZ(0);
+                -ms-transform: translateZ(0);
+                transform: translateZ(0);
+            }
+
+            .loader:before,
+            .loader:after {
+                position: absolute;
+                content: "";
+            }
+
+            .loader:before {
+                width: 5.2em;
+                height: 10.2em;
+                background: #fafafa;
+                border-radius: 10.2em 0 0 10.2em;
+                top: -0.1em;
+                left: -0.1em;
+                -webkit-transform-origin: 5.2em 5.1em;
+                transform-origin: 5.2em 5.1em;
+                -webkit-animation: load2 2s infinite ease 1.5s;
+                animation: load2 2s infinite ease 1.5s;
+            }
+
+            .loader:after {
+                width: 5.2em;
+                height: 10.2em;
+                background: #fafafa;
+                border-radius: 0 10.2em 10.2em 0;
+                top: -0.1em;
+                left: 5.1em;
+                -webkit-transform-origin: 0px 5.1em;
+                transform-origin: 0px 5.1em;
+                -webkit-animation: load2 2s infinite ease;
+                animation: load2 2s infinite ease;
+            }
+
+            @-webkit-keyframes load2 {
+                0% {
+                    -webkit-transform: rotate(0deg);
+                    transform: rotate(0deg);
+                }
+                100% {
+                    -webkit-transform: rotate(360deg);
+                    transform: rotate(360deg);
+                }
+            }
+
+            @keyframes load2 {
+                0% {
+                    -webkit-transform: rotate(0deg);
+                    transform: rotate(0deg);
+                }
+                100% {
+                    -webkit-transform: rotate(360deg);
+                    transform: rotate(360deg);
+                }
+            }
+        </style>
+    </head>
+
+    <body>
+        <noscript> You need to enable JavaScript to run this app. </noscript>
+        <div id="root">
+            <div class="loader-container">
+                <div class="loader">Loading...</div>
+            </div>
+        </div>
+    </body>
+    <script type="module" src="/src/index.tsx"></script>
+</html>