Merge branch 'release/2.26.0' into main

.env.dist

@@ -0,0 +1,16 @@
+NODE_ENV=development
+VUE_APP_ENV_NAME=develop
+
+# HK API
+VUE_APP_HK_API_ROOT=https://api.harmlesskey.com
+
+# Firebase
+VUE_APP_FIREBASE_API_KEY=FIREBASE_API_KEY
+VUE_APP_FIREBASE_AUTH_DOMAIN=auth.domain
+VUE_APP_FIREBASE_DATABASE_URL=https://firebase.db.url
+VUE_APP_FIREBASE_PROJECT_ID=PROJECT_ID
+VUE_APP_FIREBASE_STORAGE_BUCKET=storage_bucket.domain
+VUE_APP_FIREBASE_MESSAGING_SENDER_ID=SENDER_ID
+
+# If developing Character Sync locally add:
+# LOCAL_CHARACTER_SYNC_ID="extension-id"

Dockerfile

@@ -3,6 +3,8 @@ FROM node:16
 WORKDIR /app
 
 COPY ./dist/ssr .
+COPY .env.production.local .
+
 RUN npm i
 RUN npm install pm2 -g
 

docker-compose.yml

@@ -0,0 +1,12 @@
+version: "3.8"
+
+services:
+  shieldmaiden:
+    build: .
+    ports:
+      - "8080:8080"
+    volumes:
+      - .:/app
+      - /app/node_modules
+    environment:
+      NODE_ENV: development

package.json

@@ -1,5 +1,5 @@
 {
-	"version": "2.25.2",
+	"version": "2.26.0",
 	"name": "shieldmaiden",
 	"description": "A Dungeons and Dragons Combat Tracker",
 	"productName": "Shieldmaiden",
@@ -23,6 +23,7 @@
 		"animate.css": "^4.1.1",
 		"core-js": "^3.37.0",
 		"axios": "^0.28.1",
+		"core-js": "^3.36.1",
 		"cors": "^2.8.5",
 		"dotenv": "^16.4.5",
 		"firebase": "^8.0.0",

quasar.conf.js

@@ -105,7 +105,7 @@ module.exports = function (/* ctx */) {
 			// directives: [],
 
 			// Quasar plugins
-			plugins: ["AppFullscreen", "Notify", "Cookies", "Meta"],
+			plugins: ["AppFullscreen", "Notify", "Cookies", "Meta", "Dialog"],
 		},
 
 		// animations: 'all', // --- includes all animations
@@ -158,11 +158,11 @@ module.exports = function (/* ctx */) {
 						type: "image/png",
 						purpose: "maskable",
 					},
-          {
-            src: "favicon.png",
-            sizes: "48x48",
-            purpose: "any"
-          }
+					{
+						src: "favicon.png",
+						sizes: "48x48",
+						purpose: "any",
+					},
 				],
 				shortcuts: [
 					{

src-ssr/api/index.js

@@ -0,0 +1,18 @@
+const { Router } = require("express");
+const { patreonServices } = require("../../src/services/patreon");
+
+const router = new Router();
+
+router.post("/patreon/auth", async (req, res) => {
+	const service = new patreonServices();
+	const result = await service.authenticatePatreonUser(req.body.code, req.headers.origin);
+	res.json(result);
+});
+
+router.post("/patreon/identity", async (req, res) => {
+	const service = new patreonServices();
+	const result = await service.getPatreonIdentity(req.body);
+	res.send(result);
+});
+
+module.exports = router;

src-ssr/extension.js

@@ -10,12 +10,16 @@
  * Note: Changes to this file (but not any file it imports!) are picked up by the
  * development server, but such updates are costly since the dev-server needs a reboot.
  */
+const express = require("express");
+const api = require("./api");
 
 module.exports.extendApp = function ({ app, ssr }) {
-  /*
+	/*
      Extend the parts of the express app that you
      want to use with development server too.
 
      Example: app.use(), app.get() etc
   */
-}
+	app.use(express.json());
+	app.use("/api", api);
+};

src-ssr/index.js

@@ -10,7 +10,6 @@
  *   If you are looking to add common DEV & PROD logic to the express app, then use
  *   "src-ssr/extension.js"
  */
-
 const express = require("express");
 const morgan = require("morgan");
 const compression = require("compression");

src/App.vue

@@ -82,6 +82,31 @@ export default {
 		HkRolls,
 		Home,
 	},
+	async preFetch({ store, ssrContext }) {
+		const cookies = Cookies.parseSSR(ssrContext);
+		const access_token = cookies.get("access_token");
+		if (!access_token) return;
+
+		const user = jwt_decode(access_token);
+		if (!user && !user.user_id) return;
+
+		const transform = {
+			uid: "user_id",
+			displayName: "name",
+			photoURL: "picture",
+			email: "email",
+			emailVerified: "email_verified",
+		};
+
+		const transformed_user = {};
+		for (const [k, v] of Object.entries(transform)) {
+			transformed_user[k] = user[v];
+		}
+
+		await store.dispatch("setUser", transformed_user);
+		await store.dispatch("setUserInfo");
+		await store.dispatch("initialize");
+	},
 	meta() {
 		const meta = {
 			title: {
@@ -249,31 +274,6 @@ export default {
 			},
 		},
 	},
-	async preFetch({ store, ssrContext }) {
-		const cookies = Cookies.parseSSR(ssrContext);
-		const access_token = cookies.get("access_token");
-		if (!access_token) return;
-
-		const user = jwt_decode(access_token);
-		if (!user && !user.user_id) return;
-
-		const transform = {
-			uid: "user_id",
-			displayName: "name",
-			photoURL: "picture",
-			email: "email",
-			emailVerified: "email_verified",
-		};
-
-		const transformed_user = {};
-		for (const [k, v] of Object.entries(transform)) {
-			transformed_user[k] = user[v];
-		}
-
-		await store.dispatch("setUser", transformed_user);
-		await store.dispatch("setUserInfo");
-		await store.dispatch("initialize");
-	},
 	async mounted() {
 		this.setTips();
 		const cookies = document.cookie.split(";");

src/boot/hk-components.js

@@ -1,35 +1,40 @@
-import HkInput from "../components/hk-components/hk-input";
-import HkSelect from "../components/hk-components/hk-select";
-import HkIcon from "../components/hk-components/hk-icon";
-import HkTable from "../components/hk-components/hk-table";
-import HkCard from "../components/hk-components/hk-card";
-import HkCardDeck from "../components/hk-components/hk-card-deck";
-import HkShowKeybind from "../components/hk-components/hk-show-keybind";
-import HkRoll from "../components/hk-components/hk-roll";
-import HkRollAction from "../components/hk-components/hk-action-rolls/hk-roll-action";
-import HkAnimatedInteger from "../components/hk-components/hk-animated-integer";
-import HkDiceText from "../components/hk-components/hk-dice-text";
-import HkPopover from "../components/hk-components/hk-popover";
-import HkLoader from "../components/hk-components/hk-loader";
-import HkDmgTypeSelect from "../components/hk-components/hk-dmg-type-select";
-import HkTip from "../components/hk-components/hk-tip";
-import HkTimer from "../components/hk-components/hk-timer";
-import HkShare from "../components/hk-components/hk-share-button";
-import HkImageUploader from "../components/hk-components/hk-image-uploader";
-import HkBackgroundSelect from "../components/hk-components/hk-background-select";
-import HkMarkdownEditor from "../components/hk-components/hk-markdown-editor";
-import HkXpBar from "../components/hk-components/hk-xp-bar";
-import HkLinkCharacter from "../components/hk-components/hk-link-character";
-import HkActionRollForm from "../components/hk-components/hk-action-rolls/hk-action-roll-form";
-import HkActionRollsTable from "../components/hk-components/hk-action-rolls/hk-action-rolls-table";
-import HkActionRollScaling from "../components/hk-components/hk-action-rolls/hk-action-roll-scaling";
-import HkPane from "../components/hk-components/hk-pane";
-import HkFilter from "../components/hk-components/hk-filter";
-import HkTransformSelect from "../components/hk-components/hk-transform-select";
+const HkInput = () => import("../components/hk-components/hk-input");
+const HkSelect = () => import("../components/hk-components/hk-select");
+import HkDialog from "../components/hk-components/hk-dialog"; // can't load async because it's used in mounted
+const HkIcon = () => import("../components/hk-components/hk-icon");
+const HkTable = () => import("../components/hk-components/hk-table");
+const HkCard = () => import("../components/hk-components/hk-card");
+const HkCardDeck = () => import("../components/hk-components/hk-card-deck");
+const HkShowKeybind = () => import("../components/hk-components/hk-show-keybind");
+const HkRoll = () => import("../components/hk-components/hk-roll");
+const HkRollAction = () => import("../components/hk-components/hk-action-rolls/hk-roll-action");
+const HkAnimatedInteger = () => import("../components/hk-components/hk-animated-integer");
+const HkDiceText = () => import("../components/hk-components/hk-dice-text");
+const HkPopover = () => import("../components/hk-components/hk-popover");
+const HkLoader = () => import("../components/hk-components/hk-loader");
+const HkDmgTypeSelect = () => import("../components/hk-components/hk-dmg-type-select");
+const HkTip = () => import("../components/hk-components/hk-tip");
+const HkTimer = () => import("../components/hk-components/hk-timer");
+const HkShare = () => import("../components/hk-components/hk-share-button");
+const HkImageUploader = () => import("../components/hk-components/hk-image-uploader");
+const HkBackgroundSelect = () => import("../components/hk-components/hk-background-select");
+const HkMarkdownEditor = () => import("../components/hk-components/hk-markdown-editor");
+const HkXpBar = () => import("../components/hk-components/hk-xp-bar");
+const HkLinkCharacter = () => import("../components/hk-components/hk-link-character");
+const HkActionRollForm = () =>
+	import("../components/hk-components/hk-action-rolls/hk-action-roll-form");
+const HkActionRollsTable = () =>
+	import("../components/hk-components/hk-action-rolls/hk-action-rolls-table");
+const HkActionRollScaling = () =>
+	import("../components/hk-components/hk-action-rolls/hk-action-roll-scaling");
+const HkPane = () => import("../components/hk-components/hk-pane");
+const HkFilter = () => import("../components/hk-components/hk-filter");
+const HkTransformSelect = () => import("../components/hk-components/hk-transform-select");
 
 export default async ({ Vue }) => {
 	Vue.component("hk-input", HkInput);
 	Vue.component("hk-select", HkSelect);
+	Vue.component("hk-dialog", HkDialog);
 	Vue.component("hk-icon", HkIcon);
 	Vue.component("hk-table", HkTable);
 	Vue.component("hk-card", HkCard);

src/components/ContentSideRight.vue

@@ -89,11 +89,15 @@
 			<div>
 				<Tier />
 			</div>
-			<div slot="footer" v-if="tier.name !== 'Deity'">
-				<router-link to="/patreon" class="btn btn-block btn-square bg-patreon-red">
-					{{ tier.price === "Free" ? "Subscribe" : "Upgrade" }}
-				</router-link>
-			</div>
+			<PatreonLinkButton v-if="userInfo.patron && !userInfo.patreon_id" />
+			<router-link
+				v-else-if="tier.name !== 'Deity'"
+				slot="footer"
+				to="/patreon"
+				class="btn btn-block btn-square bg-patreon-red"
+			>
+				{{ tier.price === "Free" ? "Subscribe" : "Upgrade" }}
+			</router-link>
 		</hk-card>
 
 		<!-- HOMEBREW CREATION -->
@@ -167,6 +171,7 @@ export default {
 		PlayerLink: () => import("src/components/PlayerLink"),
 		Tier: () => import("src/components/userContent/Tier"),
 		Tutorial: () => import("src/components/userContent/Tutorial.vue"),
+		PatreonLinkButton: () => import("src/components/PatreonLinkButton.vue"),
 	},
 	data() {
 		return {