feat: added explorer endpoint with optional driveId param

api/src/app.ts

@@ -4,6 +4,10 @@ import expressPlayground from 'graphql-playground-middleware-express';
 import { getChildLogger } from './logger';
 import basePrisma from './database';
 import { API_GQL_ENDPOINT } from './env';
+import {
+  MiddlewareOptions,
+  renderPlaygroundPage,
+} from 'graphql-playground-html'
 
 const logger = getChildLogger({ msgPrefix: 'APP' });
 const startupTime = new Date();
@@ -30,14 +34,17 @@ export const createApp = (): Express => {
   });
 
   app.get(
-    '/',
-    expressPlayground({
-      endpoint: API_GQL_ENDPOINT,
-      settings: {
-        'editor.theme': 'light',
-        'request.credentials': 'include',
-      },
-    }),
+    '/explorer/:driveId?',
+    (req, res) => {
+      res.setHeader('Content-Type', 'text/html')
+      const endpoint = API_GQL_ENDPOINT + (req.params.driveId !== undefined ? `/d/${req.params.driveId}` : '/drives')
+      res.send(renderPlaygroundPage({
+        endpoint: endpoint,
+        settings: {
+          'request.credentials': 'include',
+        },
+      }))
+    }
   );
 
   return app;

api/src/env/index.ts

@@ -8,9 +8,9 @@ export const PORT = process.env.PORT ?? "3000";
 export const isDevelopment = process.env.NODE_ENV === "development";
 export const AUTH_SIGNUP_ENABLED = Boolean(process.env.AUTH_SIGNUP_ENABLED);
 export const JWT_EXPIRATION_PERIOD: string = getJwtExpirationPeriod();
-export const API_ORIGIN = process.env.API_ORIGIN || `http://0.0.0.0:${PORT}`;
+export const API_ORIGIN = process.env.API_ORIGIN || `http://localhost:${PORT}`;
 export const API_GQL_ENDPOINT =
-  process.env.API_GQL_ENDPOINT || `${API_ORIGIN}/graphql`;
+  process.env.API_GQL_ENDPOINT || `${API_ORIGIN}`;
 export const CORS_ORIGINS = process.env.ORIGINS?.split(",") ?? [
   "https://studio.apollographql.com",
   "https://ph-switchboard-nginx-prod-c84ebf8c6e3b.herokuapp.com",