enh: simplify adding new graphql endpoint

README.md

@@ -15,8 +15,8 @@ $ git clone https://git.duniter.org/paidge/wotwizard-ui.git
 $ cd wotwizard-ui
 # If you want to use the git's hook to prevent commits if language strings are missing
 $ git config --local core.hooksPath .githooks/
-# To be sure to use Node 16
-$ nvm use 16
+# To be sure to use Node 20
+$ nvm use 20
 # Create your branch
 $ git checkout -b my-branch
 # Install the dependencies of the project
@@ -34,6 +34,10 @@ $ git push
 
 Then create a merge request.
 
+### Add new wotwizard graphql endpoint
+
+Just add your new endpoint in `endpoints.json` file and rebuild app.
+
 ### Add a new page
 
 Copy/paste the file `./pages/template.vue` and rename it to create a new page.

endpoints.json

+{
+    "AxiomTeam": "https://gql.wotwizard.axiom-team.fr/",
+    "trentesaux": "https://gql.wotwizard.trentesaux.fr/"
+}

graphql/endpoints/AxiomTeam.js

+
+const { HttpLink } = require("apollo-link-http");
+const { setContext } = require("apollo-link-context");
+const { from } = require("apollo-link");
+const { cache } = require("../cache");
+
+const ssrMiddleware = setContext((_, { headers }) => {
+    if (process.client) return headers;
+    return { headers };
+});
+
+const httpLink = new HttpLink({ uri: "https://gql.wotwizard.axiom-team.fr/" });
+const link = from([ssrMiddleware, httpLink]);
+
+module.exports = () => ({
+    link,
+    cache,
+    defaultHttpLink: false
+});

graphql/endpoints/axiom-team.js

-import { HttpLink } from "apollo-link-http"
-import { setContext } from "apollo-link-context"
-import { from } from "apollo-link"
-import { cache } from "../cache"
-
-export default (ctx) => {
-	const ssrMiddleware = setContext((_, { headers }) => {
-		if (process.client) return headers
-		return {
-			headers
-		}
-	})
-
-	const httpLink = new HttpLink({
-		uri: "https://gql.wotwizard.axiom-team.fr/"
-	})
-
-	const link = from([ssrMiddleware, httpLink])
-
-	return {
-		link,
-		cache,
-		// https://github.com/nuxt-community/apollo-module/issues/306#issuecomment-607225431
-		defaultHttpLink: false
-	}
-}

graphql/endpoints/trentesaux.js

-import { HttpLink } from "apollo-link-http"
-import { setContext } from "apollo-link-context"
-import { from } from "apollo-link"
-import { cache } from "../cache"
 
-export default (ctx) => {
-	const ssrMiddleware = setContext((_, { headers }) => {
-		if (process.client) return headers
-		return {
-			headers
-		}
-	})
+const { HttpLink } = require("apollo-link-http");
+const { setContext } = require("apollo-link-context");
+const { from } = require("apollo-link");
+const { cache } = require("../cache");
 
-	const httpLink = new HttpLink({
-		uri: "https://gql.wotwizard.trentesaux.fr/"
-	})
+const ssrMiddleware = setContext((_, { headers }) => {
+    if (process.client) return headers;
+    return { headers };
+});
 
-	const link = from([ssrMiddleware, httpLink])
+const httpLink = new HttpLink({ uri: "https://gql.wotwizard.trentesaux.fr/" });
+const link = from([ssrMiddleware, httpLink]);
 
-	return {
-		link,
-		cache,
-		// https://github.com/nuxt-community/apollo-module/issues/306#issuecomment-607225431
-		defaultHttpLink: false
-	}
-}
+module.exports = () => ({
+    link,
+    cache,
+    defaultHttpLink: false
+});

graphql/generateEndpoints.js

+const fs = require('fs');
+const path = require('path');
+const endpoints = require('../endpoints.json');
+
+const endpointDir = path.join(__dirname, 'endpoints');
+
+const recreateDirectory = (directory) => {
+  if (fs.existsSync(directory)) {
+    fs.rmSync(directory, { recursive: true, force: true });
+  }
+
+  fs.mkdirSync(directory, { recursive: true });
+};
+
+recreateDirectory(endpointDir);
+
+const configTemplate = (uri) => `
+const { HttpLink } = require("apollo-link-http");
+const { setContext } = require("apollo-link-context");
+const { from } = require("apollo-link");
+const { cache } = require("../cache");
+
+const ssrMiddleware = setContext((_, { headers }) => {
+    if (process.client) return headers;
+    return { headers };
+});
+
+const httpLink = new HttpLink({ uri: "${uri}" });
+const link = from([ssrMiddleware, httpLink]);
+
+module.exports = () => ({
+    link,
+    cache,
+    defaultHttpLink: false
+});
+`;
+
+Object.keys(endpoints).forEach(key => {
+  const filePath = path.join(endpointDir, `${key}.js`);
+  const fileContent = configTemplate(endpoints[key]);
+  fs.writeFileSync(filePath, fileContent);
+});

nuxt.config.js

-import i18n from "./i18n"
+const i18n = require("./i18n");
+const endpoints = require('./endpoints.json');
 
 export default {
 	// Disable server-side rendering: https://go.nuxtjs.dev/ssr-mode
@@ -114,10 +115,10 @@ export default {
 	},
 
 	apollo: {
-		clientConfigs: {
-			trentesaux: "~/graphql/endpoints/trentesaux",
-			axiomTeam: "~/graphql/endpoints/axiom-team"
-		}
+		clientConfigs: Object.keys(endpoints).reduce((configs, key) => {
+			configs[key] = `~/graphql/endpoints/${key}.js`;
+			return configs;
+		}, {}),
 	},
 
 	router: {

package.json

@@ -3,9 +3,10 @@
 	"version": "2.5.2",
 	"private": true,
 	"scripts": {
-		"dev": "nuxt",
+		"dev": "npm run generate-endpoints && nuxt",
 		"trad": "sh ./utils/findMissingI18nKeys.sh",
-		"build": "npm-run-all -p build-fragment nuxt-build",
+		"generate-endpoints": "node graphql/generateEndpoints.js",
+		"build": "npm run generate-endpoints && npm-run-all -p build-fragment nuxt-build",
 		"start": "npm-run-all -p build-fragment nuxt-start",
 		"generate": "npm-run-all -p build-fragment nuxt-generate && cp ./web-ext/* ./dist/",
 		"analyze": "nuxt build --analyze",
@@ -24,6 +25,7 @@
 		"bootstrap": "5.1.3",
 		"core-js": "^3.15.1",
 		"graphql-tag": "^2.12.6",
+		"node-fetch": "^3.3.2",
 		"nuxt": "^2.15.8",
 		"vue": "^2.6.14"
 	},