Port to TypeScript & Pinia (#7)

Co-authored-by: Philipp Walter <[email protected]>
runcitadel · Mar 15, 2022 · 19afad2 · 19afad2
1 parent f618155
commit 19afad2
Show file tree

Hide file tree

Showing 98 changed files with 5,008 additions and 4,320 deletions.
diff --git a/.yarn/releases/yarn-3.1.1.cjs b/.yarn/releases/yarn-3.1.1.cjs
diff --git a/.yarn/releases/yarn-3.2.0.cjs b/.yarn/releases/yarn-3.2.0.cjs
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -1,3 +1,3 @@
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.1.1.cjs
+yarnPath: .yarn/releases/yarn-3.2.0.cjs
diff --git a/Dockerfile b/Dockerfile
@@ -1,31 +1,50 @@
-# Run the build on the host architecture, change this if you're building on arm64
-FROM amd64/node:16-bullseye-slim AS citadel-dashboard-builder
+# Define version & use pinned images
+ARG NODE_VERSION=16
 
-ARG STAGING_DEPLOYMENT=false
+# Build on the host architecture, change this if you're building on arm64
+FROM amd64/node:${NODE_VERSION}-alpine@sha256:425c81a04546a543da824e67c91d4a603af16fbc3d875ee2f276acf8ec2b1577 as node-builder
+# Use multi-arch image for running the app
+FROM node:${NODE_VERSION}-alpine@sha256:2c6c59cf4d34d4f937ddfcf33bab9d8bbad8658d1b9de7b97622566a52167f2b as node-runner
 
-# make the 'app' folder the current working directory
+
+# DEVELOPMENT
+FROM node-builder AS development
+# Create app directory
 WORKDIR /app
+# NOTE: Using project files from mounted volumes
+ENV NODE_ENV development
+ENV PORT 3004
+EXPOSE 3004
+USER node
+CMD yarn install && yarn dev
 
 
-# copy project files and folders to the current working directory (i.e. 'app' folder)
-COPY .yarnrc.yml package.json yarn.lock .
-COPY .yarn/releases/yarn-3.1.1.cjs /app/.yarn/releases/yarn-3.1.1.cjs
-# install dependencies
-RUN yarn
+# DEPENDENCIES (production)
+FROM node-builder AS dependencies
+# Create app directory
+WORKDIR /app
 
-COPY . .
+# Copy dependency management files
+COPY .yarnrc.yml package.json yarn.lock ./
+COPY .yarn/releases/yarn-3.2.0.cjs /app/.yarn/releases/yarn-3.2.0.cjs
+# Install dependencies
+RUN yarn install
 
-# build app for production
-RUN yarn build
 
+# BUILD (production)
+FROM dependencies AS builder
+# Copy project files and folders to the current working directory (i.e. 'app' folder)
+COPY . .
+# Build app for production
+RUN yarn build
 
-FROM node:16-bullseye-slim AS citadel-dashboard
 
+# PRODUCTION
+FROM node-runner AS production
 RUN npm -g i serve
-
-COPY --from=citadel-dashboard-builder /app/dist/ /dist
-
-ENV PORT=3004
+COPY --from=builder --chown=node:node /app/dist/ /dist
+ENV NODE_ENV prodution
+ENV PORT 3004
 EXPOSE 3004
-
+USER node
 CMD [ "serve", "--single", "/dist" ]
diff --git a/index.html b/index.html
@@ -1,24 +1,23 @@
 <!DOCTYPE html>
 <html lang="en">
+  <head>
+    <title>Citadel</title>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <meta name="robots" content="noindex, nofollow" />
+    <meta name="referrer" content="no-referrer" />
+    <link rel="icon" href="/favicon.png" />
+    <meta name="description" content="Welcome back" />
+  </head>
 
-<head>
-  <title>Citadel</title>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1.0">
-  <meta name="robots" content="noindex, nofollow" />
-  <meta name="referrer" content="no-referrer" />
-  <link rel="icon" href="/favicon.png">
-  <meta name="description" content="Welcome back">
-</head>
-
-<body>
-  <noscript>
-    <strong>We're sorry, but Citadel
-      doesn't work properly without JavaScript enabled. Please enable it to
-      continue.</strong>
-  </noscript>
-  <div id="app"></div>
-  <script type="module" src="/src/main.js"></script>
-</body>
-
-</html>
+  <body>
+    <noscript>
+      <strong
+        >We're sorry, but Citadel doesn't work properly without JavaScript
+        enabled. Please enable it to continue.</strong
+      >
+    </noscript>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "citadel-dashboard",
+  "name": "@runcitadel/dashboard",
   "version": "0.3.25",
   "private": true,
   "scripts": {
@@ -10,35 +10,35 @@
   },
   "dependencies": {
     "@aarondewes/vue-slider-component": "^3.2.16",
-    "@bitcoin-design/bitcoin-icons-vue": "^0.1.8",
-    "@runcitadel/sdk": "^0.3.2",
+    "@bitcoin-design/bitcoin-icons-vue": "^0.1.9",
+    "@runcitadel/sdk": "^0.3.3",
     "@vue/compat": "^3.2.31",
     "bignumber.js": "^9.0.2",
     "bootstrap": "^5.1.3",
     "bootstrap-vue": "https://github.com/bootstrap-vue/bootstrap-vue.git#vue3-compat-build",
     "bootstrap-vue-upstream": "npm:[email protected]",
     "buffer": "^6.0.3",
-    "countup.js": "^2.0.8",
+    "countup.js": "^2.1.0",
     "date-fns": "^2.28.0",
     "qrcode.vue": "^3.3.3",
-    "typescript": "^4.5.5",
+    "typescript": "^4.6.2",
     "vue": "^3.2.31",
     "vue-confetti": "^2.3.0",
-    "vue-router": "^4.0.12",
-    "vuex": "^4.0.2"
+    "vue-router": "^4.0.13"
   },
   "devDependencies": {
-    "@types/node": "^17.0.19",
-    "@typescript-eslint/eslint-plugin": "^5.12.0",
-    "@typescript-eslint/parser": "^5.12.0",
-    "@vitejs/plugin-vue": "^2.2.0",
-    "eslint": "^8.9.0",
-    "eslint-config-prettier": "^8.3.0",
+    "@types/node": "^17.0.21",
+    "@typescript-eslint/eslint-plugin": "^5.13.0",
+    "@typescript-eslint/parser": "^5.13.0",
+    "@vitejs/plugin-vue": "^2.2.4",
+    "eslint": "^8.10.0",
+    "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-vue": "^8.4.1",
+    "eslint-plugin-vue": "^8.5.0",
+    "pinia": "^2.0.11",
     "prettier": "^2.5.1",
-    "sass": "^1.49.7",
-    "vite": "^2.8.3"
+    "sass": "^1.49.9",
+    "vite": "^2.8.6"
   },
   "eslintConfig": {
     "parser": "vue-eslint-parser",
@@ -68,7 +68,7 @@
     "not dead",
     "not ie 11"
   ],
-  "packageManager": "yarn@3.1.1",
+  "packageManager": "yarn@3.2.0",
   "resolutions": {
     "portal-vue": "^3.0.0-beta.0"
   },