feat(comment2): rename type to provider

rename type to provider BREAKING CHANGE : rename type to provider
vuepress-theme-hope · Jun 3, 2022 · 28410bc · 28410bc
1 parent d096fe2
commit 28410bc
Show file tree

Hide file tree

Showing 16 changed files with 168 additions and 96 deletions.
diff --git a/docs/comment2/src/config/README.md b/docs/comment2/src/config/README.md
@@ -3,10 +3,10 @@ title: Options
 icon: config
 ---
 
-## type
+## provider
 
-- Type: `"giscus" | "twikoo" | "waline" | "none"`
-- Default: `"none"`
+- Type: `"Giscus" | "Twikoo" | "Waline" | "None"`
+- Default: `"None"`
 
 Comment service provider.
 

diff --git a/docs/comment2/src/zh/config/README.md b/docs/comment2/src/zh/config/README.md
@@ -5,8 +5,8 @@ icon: config
 
 ## type
 
-- 类型: `"giscus" | "twikoo" | "waline" | "none"`
-- 默认: `"none"`
+- 类型: `"Giscus" | "Twikoo" | "Waline" | "None"`
+- 默认: `"None"`
 
 评论服务提供者。
 

diff --git a/packages/comment2/src/client/components/Giscus.ts b/packages/comment2/src/client/components/Giscus.ts
@@ -1,14 +1,24 @@
 import { usePageFrontmatter, usePageLang, withBase } from "@vuepress/client";
 import { computed, defineComponent, h, onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
-import { enableGiscus, giscusOption } from "../define";
 
 import type { VNode } from "vue";
 import type { GiscusLang, GiscusMapping, GiscusProps } from "../utils";
-import type { CommentPluginFrontmatter } from "../../shared";
+import type { CommentPluginFrontmatter, GiscusOptions } from "../../shared";
 
 import "../styles/giscus.scss";
 
+declare const COMMENT_OPTIONS: GiscusOptions;
+
+const giscusOption = COMMENT_OPTIONS;
+
+const enableGiscus = Boolean(
+  giscusOption.repo &&
+    giscusOption.repoId &&
+    giscusOption.category &&
+    giscusOption.categoryId
+);
+
 const SUPPORTED_LANGUAGES: GiscusLang[] = [
   "de",
   "gsw",

diff --git a/packages/comment2/src/client/components/Twikoo.ts b/packages/comment2/src/client/components/Twikoo.ts
@@ -1,12 +1,17 @@
 import { usePageFrontmatter, usePageLang } from "@vuepress/client";
 import { computed, defineComponent, h, onMounted } from "vue";
-import { enableTwikoo, twikooOption } from "../define";
 
 import type { VNode } from "vue";
-import type { CommentPluginFrontmatter } from "../../shared";
+import type { CommentPluginFrontmatter, TwikooOptions } from "../../shared";
 
 import "../styles/twikoo.scss";
 
+declare const COMMENT_OPTIONS: TwikooOptions;
+
+const twikooOption = COMMENT_OPTIONS;
+
+const enableTwikoo = Boolean(twikooOption.envId);
+
 export default defineComponent({
   name: "TwikooComment",
 

diff --git a/packages/comment2/src/client/components/Waline.ts b/packages/comment2/src/client/components/Waline.ts
@@ -5,14 +5,26 @@ import { computed, defineComponent, h, onMounted, watch } from "vue";
 import { useRoute } from "vue-router";
 import { useLocaleConfig } from "vuepress-shared/lib/client";
 
-import { enableWaline, walineLocales, walineOption } from "../define";
-
 import type { VNode } from "vue";
-import type { CommentPluginFrontmatter } from "../../shared";
+import type {
+  CommentPluginFrontmatter,
+  WalineLocaleConfig,
+  WalineOptions,
+} from "../../shared";
 
 import "@waline/client/dist/waline.css";
 import "../styles/waline.scss";
 
+declare const COMMENT_OPTIONS: WalineOptions;
+
+declare const WALINE_LOCALES: WalineLocaleConfig;
+
+export const walineOption = COMMENT_OPTIONS;
+
+export const enableWaline = Boolean(walineOption.serverURL);
+
+export const walineLocales = WALINE_LOCALES;
+
 export default defineComponent({
   name: "WalineComment",
 

diff --git a/packages/comment2/src/client/config.ts b/packages/comment2/src/client/config.ts
@@ -1,10 +1,13 @@
 import { defineClientConfig, usePageFrontmatter } from "@vuepress/client";
 import { computed, defineComponent, h } from "vue";
 import CommentProvider from "@CommentProvider";
-import { commentOptions } from "./define";
 
 import type { VNode } from "vue";
-import type { CommentPluginFrontmatter } from "../shared";
+import type { CommentOptions, CommentPluginFrontmatter } from "../shared";
+
+declare const COMMENT_OPTIONS: CommentOptions;
+
+const enableComment = COMMENT_OPTIONS;
 
 export default defineClientConfig({
   enhance: ({ app }) => {
@@ -21,8 +24,7 @@ export default defineClientConfig({
         const enabled = computed(() => {
           return (
             frontmatter.value.comment ||
-            (commentOptions.comment !== false &&
-              frontmatter.value.comment !== false)
+            (enableComment !== false && frontmatter.value.comment !== false)
           );
         });
 

diff --git a/packages/comment2/src/client/define.ts b/packages/comment2/src/client/define.ts
diff --git a/packages/comment2/src/node/compact.ts b/packages/comment2/src/node/compact.ts
@@ -0,0 +1,72 @@
+import type { CommentOptions } from "../shared";
+
+/** @deprecated */
+export const covertOptions = (
+  options: CommentOptions & Record<string, unknown>
+): void => {
+  if ("type" in options) {
+    console.warn(`"type" is deprecated, please use "provider".`);
+    if (options["type"] === "waline") options.provider = "Waline";
+    else if (options["type"] === "giscus") options.provider = "Giscus";
+    else if (options["type"] === "twikoo") options.provider = "Twikoo";
+
+    delete options["type"];
+  }
+
+  // covert Waline options
+  if (options.provider === "Waline") {
+    [
+      // valine
+      ["emojiCDN", "emoji"],
+      ["emojiMaps", "emoji"],
+      ["requiredFields", "requiredMeta"],
+      ["visitor", "pageview"],
+      ["langMode", "locale"],
+      ["placeholder", "locale.placeholder"],
+
+      // waline v1
+      ["highlight", "highlighter"],
+      ["uploadImage", "imageUploader"],
+      ["previewMath", "texRenderer"],
+      ["anonymous", "login"],
+      ["copyRight", "copyright"],
+    ].forEach(([oldOptions, newOptions]) => {
+      if (oldOptions in options) {
+        console.warn(
+          `"${oldOptions}" is deprecated in @waline/client@v2, you should use "${newOptions}" instead.`
+        );
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        delete options[oldOptions];
+      }
+    });
+
+    [
+      // valine
+      "region",
+      "appId",
+      "appKey",
+      "notify",
+      "verify",
+      "avatar",
+      "avatarForce",
+      "enableQQ",
+      "recordIP",
+      "serverURLs",
+
+      // waline v1
+      "avatarCDN",
+      "mathTagSupport",
+    ].forEach((option) => {
+      if (option in options) {
+        console.warn(
+          `"${option}" is no longer supported in @waline/client@v2.`
+        );
+
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        delete options[option];
+      }
+    });
+  }
+};
diff --git a/packages/comment2/src/node/plugin.ts b/packages/comment2/src/node/plugin.ts
@@ -9,6 +9,7 @@ import {
   noopModule,
 } from "vuepress-shared";
 
+import { covertOptions } from "./compact";
 import { walineLocales } from "./locales";
 import { logger } from "./utils";
 
@@ -17,22 +18,28 @@ import type { PluginFunction } from "@vuepress/core";
 
 /** Comment Plugin */
 export const commentPlugin =
-  (options: CommentOptions): PluginFunction =>
+  (options: CommentOptions, legacy = false): PluginFunction =>
   (app) => {
+    // TODO: Remove this in V2
+    if (legacy)
+      covertOptions(options as CommentOptions & Record<string, unknown>);
     if (app.env.isDebug) logger.info(`Options: ${options.toString()}`);
 
-    const isGiscus = options.type === "giscus";
-    const isTwikoo = options.type === "twikoo";
-    const isWaline = options.type === "waline";
+    const provider =
+      options.provider &&
+      ["Giscus", "Waline", "Twikoo"].includes(options.provider)
+        ? options.provider
+        : "None";
 
-    const userWalineLocales = isWaline
-      ? getLocales({
-          app,
-          name: "waline",
-          default: walineLocales,
-          config: options.walineLocales,
-        })
-      : {};
+    const userWalineLocales =
+      options.provider === "Waline"
+        ? getLocales({
+            app,
+            name: "waline",
+            default: walineLocales,
+            config: options.walineLocales,
+          })
+        : {};
 
     // remove locales so that they won’t be injected in client twice
     if ("walineLocales" in options) delete options.walineLocales;
@@ -43,13 +50,10 @@ export const commentPlugin =
       name: "vuepress-plugin-comment2",
 
       alias: {
-        "@CommentProvider": isGiscus
-          ? path.resolve(__dirname, "../client/components/Giscus.js")
-          : isTwikoo
-          ? path.resolve(__dirname, "../client/components/Twikoo.js")
-          : isWaline
-          ? path.resolve(__dirname, "../client/components/Waline.js")
-          : noopModule,
+        "@CommentProvider":
+          provider === "None"
+            ? noopModule
+            : path.resolve(__dirname, `../client/components/${provider}.js`),
       },
 
       define: () => ({
@@ -58,21 +62,20 @@ export const commentPlugin =
       }),
 
       extendsBundlerOptions: (config: unknown, app): void => {
-        if (isGiscus) addCustomElement({ app, config }, "GiscusWidget");
-
-        if (isGiscus) {
+        if (provider === "Giscus") {
+          addCustomElement({ app, config }, "GiscusWidget");
           addViteSsrExternal({ app, config }, "giscus");
         }
 
-        if (isTwikoo) {
-          addViteOptimizeDepsInclude({ app, config }, "twikoo");
-          addViteSsrExternal({ app, config }, "twikoo");
-        }
-
-        if (isWaline) {
+        if (provider === "Waline") {
           addViteOptimizeDepsInclude({ app, config }, "autosize");
           addViteOptimizeDepsExclude({ app, config }, "@waline/client");
         }
+
+        if (provider === "Twikoo") {
+          addViteOptimizeDepsInclude({ app, config }, "twikoo");
+          addViteSsrExternal({ app, config }, "twikoo");
+        }
       },
 
       clientConfigFile: path.resolve(__dirname, "../client/config.js"),

diff --git a/packages/comment2/src/shared/options/disable.ts b/packages/comment2/src/shared/options/disable.ts
@@ -1,6 +1,6 @@
 import type { BaseCommentOptions } from "./base";
 
 export interface DisableCommentOptions extends BaseCommentOptions {
-  type?: "none";
-  comment: never;
+  provider?: "None";
+  comment?: never;
 }
diff --git a/packages/comment2/src/shared/options/giscus.ts b/packages/comment2/src/shared/options/giscus.ts
@@ -1,7 +1,7 @@
 import type { BaseCommentOptions } from "./base";
 
 export interface GiscusOptions extends BaseCommentOptions {
-  type: "giscus";
+  provider: "Giscus";
 
   /**
    * The name of repository to store discussions.

diff --git a/packages/comment2/src/shared/options/twikoo.ts b/packages/comment2/src/shared/options/twikoo.ts
@@ -19,5 +19,5 @@ export interface TwikooInitOptions {
 }
 
 export interface TwikooOptions extends BaseCommentOptions, TwikooInitOptions {
-  type: "twikoo";
+  provider: "Twikoo";
 }
diff --git a/packages/comment2/src/shared/options/waline.ts b/packages/comment2/src/shared/options/waline.ts
@@ -10,7 +10,7 @@ export type WalineLocaleConfig = ConvertLocaleConfig<WalineLocaleData>;
 export interface WalineOptions
   extends BaseCommentOptions,
     Omit<WalineInitOptions, "el" | "comment"> {
-  type: "waline";
+  provider: "Waline";
 
   /**
    * 是否启用访问量

diff --git a/packages/theme/src/node/plugins/comment.ts b/packages/theme/src/node/plugins/comment.ts
@@ -4,13 +4,19 @@ import type { PluginObject } from "@vuepress/core";
 import type { CommentOptions } from "vuepress-plugin-comment2";
 
 export const getCommentPlugin = (
-  options?: Partial<CommentOptions> | false
+  options?: Partial<CommentOptions> | false,
+  legacy = false
 ): PluginObject | null => {
-  if (options === false || !options?.type) return null;
+  if (options === false || !options?.provider) return null;
 
-  return commentPlugin({
-    type: "disable",
-    ...(options?.type === "waline" ? { dark: 'html[data-theme="dark"]' } : {}),
-    ...(options || {}),
-  } as CommentOptions);
+  return commentPlugin(
+    {
+      provider: "None",
+      ...(options?.provider === "Waline"
+        ? { dark: 'html[data-theme="dark"]' }
+        : {}),
+      ...(options || {}),
+    } as CommentOptions,
+    legacy
+  );
 };