Commit progress on adding routes for global data

Author: paulpopus

demo/src/payload.config.ts

@@ -7,6 +7,10 @@ import Users from "./collections/Users";
 import Media from "./collections/Media";
 import payloadDashboardAnalytics from "../../src/index";
 
+const PLAUSIBLE_API_KEY = process.env.PLAUSIBLE_API_KEY;
+const PLAUSIBLE_HOST = process.env.PLAUSIBLE_HOST;
+const PLAUSIBLE_SITE_ID = process.env.PLAUSIBLE_SITE_ID;
+
 export default buildConfig({
   serverURL: "http://localhost:3000",
   admin: {
@@ -23,8 +27,9 @@ export default buildConfig({
     payloadDashboardAnalytics({
       provider: {
         source: "plausible",
-        apiSecret: "placeholder",
-        websiteId: "payloadDemo",
+        apiSecret: PLAUSIBLE_API_KEY,
+        siteId: PLAUSIBLE_SITE_ID,
+        host: PLAUSIBLE_HOST,
       },
     }),
   ],

demo/yarn.lock

@@ -1,17 +1,24 @@
 import { Config as PayloadConfig } from "payload/config";
 import { DashboardAnalyticsConfig } from "./types";
 import { extendWebpackConfig } from "./extendWebpackConfig";
+import getProvider from "./providers";
+import getGlobalAggregateData from "./routes/getGlobalAggregateData";
 
 const payloadDashboardAnalytics =
   (incomingConfig: DashboardAnalyticsConfig) =>
   (config: PayloadConfig): PayloadConfig => {
     const { admin } = config;
+    const { provider } = incomingConfig;
+    const endpoints = config.endpoints ?? [];
+    const apiProvider = getProvider(provider);
 
     const processedConfig: PayloadConfig = {
+      ...config,
       admin: {
         ...admin,
         webpack: extendWebpackConfig(config),
       },
+      endpoints: [...endpoints, getGlobalAggregateData(apiProvider)],
     };
 
     return processedConfig;

src/index.ts

@@ -0,0 +1,18 @@
+import plausible from "./plausible";
+import type { Provider } from "../types";
+
+export type ApiProvider = {
+  getGlobalAggregateData: () => Promise<any>;
+  /* getGlobalChartData: () => {},
+    getPageAggregateData: () => {},
+    getPageChartData: () => {}, */
+};
+
+const getProvider = (provider: Provider) => {
+  switch (provider.source) {
+    case "plausible":
+      return plausible(provider);
+  }
+};
+
+export default getProvider;

src/providers/index.ts

@@ -0,0 +1,36 @@
+import type { PlausibleProvider } from "../../types";
+
+function client(provider: PlausibleProvider, endpoint?: string) {
+  const host = provider.host ?? `https://plausible.io`;
+  const apiVersion = `v1`; // for future use
+
+  const url = new URL(`${host}/api/${apiVersion}${endpoint}`);
+  url.searchParams.append("site_id", provider.siteId);
+
+  const plausibleMetrics = [
+    "visitors",
+    "pageviews",
+    "bounce_rate",
+    "visit_duration",
+  ];
+
+  const baseUrl = String(url.href);
+  url.searchParams.append("period", "30d");
+  url.searchParams.append("metrics", String(plausibleMetrics));
+
+  return {
+    host: host,
+    baseUrl: baseUrl,
+    url: url,
+    fetch: async () =>
+      await fetch(url, {
+        method: "get",
+        headers: new Headers({
+          Authorization: `Bearer ${provider.apiSecret}`,
+          "Content-Type": "application/x-www-form-urlencoded",
+        }),
+      }),
+  };
+}
+
+export default client;

src/providers/plausible/client.ts

@@ -0,0 +1,14 @@
+import type { PlausibleProvider } from "../../types";
+import client from "./client";
+
+async function getGlobalAggregateData(provider: PlausibleProvider) {
+  const plausibleClient = client(provider, "/stats/aggregate");
+
+  const data = await plausibleClient.fetch().then((response) => {
+    return response.json();
+  });
+
+  return data;
+}
+
+export default getGlobalAggregateData;

src/providers/plausible/getGlobalAggregateData.ts

@@ -0,0 +1,14 @@
+import { PlausibleProvider } from "../../types";
+import getGlobalAggregateData from "./getGlobalAggregateData";
+import { ApiProvider } from "..";
+
+const plausible = (provider: PlausibleProvider): ApiProvider => {
+  return {
+    getGlobalAggregateData: async () => await getGlobalAggregateData(provider),
+    /* getGlobalChartData: () => {},
+    getPageAggregateData: () => {},
+    getPageChartData: () => {}, */
+  };
+};
+
+export default plausible;

src/providers/plausible/index.ts

@@ -0,0 +1,19 @@
+import { Endpoint } from "payload/config";
+import { ApiProvider } from "../../providers";
+import payload from "payload";
+
+const handler = (provider: ApiProvider) => {
+  const handler: Endpoint["handler"] = async (req, res, next) => {
+    try {
+      const data = await provider.getGlobalAggregateData();
+      res.status(200).send(data);
+    } catch (error) {
+      payload.logger.error(payload);
+      res.status(500);
+    }
+  };
+
+  return handler;
+};
+
+export default handler;

src/routes/getGlobalAggregateData/handler.ts

@@ -0,0 +1,13 @@
+import { Endpoint } from "payload/config";
+import handler from "./handler";
+import { ApiProvider } from "../../providers";
+
+const getGlobalAggregateData = (provider: ApiProvider): Endpoint => {
+  return {
+    path: "/analytics/globalAggregateData",
+    method: "get",
+    handler: handler(provider),
+  };
+};
+
+export default getGlobalAggregateData;

src/routes/getGlobalAggregateData/index.ts

@@ -1,10 +1,11 @@
 import { Payload } from "payload";
 import { Config as PayloadConfig } from "payload/config";
 
-interface PlausibleProvider {
+export interface PlausibleProvider {
   source: "plausible";
   apiSecret: string;
-  websiteId: string;
+  siteId: string;
+  host?: string;
 }
 
 interface GoogleProvider {
@@ -13,7 +14,7 @@ interface GoogleProvider {
   propertyId: string;
 }
 
-type Provider = PlausibleProvider | GoogleProvider;
+export type Provider = PlausibleProvider;
 
 export type DashboardAnalyticsConfig = {
   provider: Provider;