Initial Commit

.env.example

@@ -0,0 +1,6 @@
+# GitHub AppsのID
+APP_ID=
+# GitHub AppsのクライアントID
+CLIENT_ID=
+# GitHub Appsのクライアントシークレット
+CLIENT_SECRET=

.eslintrc.cjs

@@ -0,0 +1,128 @@
+const vueEslintParser = "vue-eslint-parser";
+const vueEslintParserOptions = {
+  ecmaVersion: 2020,
+  parser: "@typescript-eslint/parser",
+};
+const tsEslintOptions = {
+  project: ["./tsconfig.app.json", "./tsconfig.node.json"],
+  tsconfigRootDir: __dirname,
+};
+
+const tsEslintRules = {
+  // Storeでよくasyncなしの関数を定義するので無効化
+  // TODO: いずれは有効化する
+  "@typescript-eslint/require-await": "off",
+
+  "@typescript-eslint/no-misused-promises": [
+    "error",
+    {
+      // (...) => voidに(...) => Promise<void>を渡すのは許可
+      // ただし特に強い意志でこれを許可しているわけではないので、
+      // もし問題が発生した場合は有効化する
+      // ref: https://canary.discord.com/channels/879570910208733277/893889888208977960/1267467454876225536
+      checksVoidReturn: false,
+    },
+  ],
+};
+
+/** @type {import('@typescript-eslint/utils').TSESLint.Linter.ConfigType} */
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+  },
+  extends: [
+    "plugin:vue/vue3-recommended",
+    "eslint:recommended",
+    "@vue/typescript/recommended",
+    "@vue/prettier",
+    "@vue/eslint-config-typescript/recommended",
+    "@vue/eslint-config-prettier",
+  ],
+  plugins: ["import"],
+  parser: vueEslintParser,
+  parserOptions: vueEslintParserOptions,
+  ignorePatterns: ["dist/**/*", "node_modules/**/*"],
+  rules: {
+    "linebreak-style":
+      process.env.NODE_ENV === "production" && process.platform !== "win32"
+        ? ["error", "unix"]
+        : "off",
+    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "no-constant-condition": ["error", { checkLoops: false }], // while(true) などを許可
+    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "prettier/prettier": [
+      "error",
+      {
+        endOfLine: "auto",
+      },
+    ],
+    "vue/no-restricted-syntax": [
+      "error",
+      {
+        selector: "LogicalExpression[operator=??]",
+        message: `template内で"??"を使うとgithubのsyntax highlightが崩れるので\n三項演算子等を使って書き換えてください`,
+      },
+      {
+        selector: "MemberExpression[optional=true]",
+        message: `template内で"?."を使うとgithubのsyntax highlightが崩れるので\n三項演算子等を使って書き換えてください`,
+      },
+    ],
+    "@typescript-eslint/no-unused-vars": [
+      process.env.NODE_ENV === "development" ? "warn" : "error", // 開発時のみwarn
+      {
+        ignoreRestSiblings: true,
+      },
+    ],
+    "vue/attribute-hyphenation": ["error", "never"],
+    "vue/v-on-event-hyphenation": ["error", "never", { autofix: true }],
+    "vue/v-bind-style": ["error", "shorthand", { sameNameShorthand: "always" }],
+    "vue/component-name-in-template-casing": [
+      "error",
+      "PascalCase",
+      {
+        registeredComponentsOnly: false,
+        ignores: [],
+      },
+    ],
+    "vue/component-tags-order": [
+      "error",
+      {
+        order: ["template", "script", "style"],
+      },
+    ],
+    "vue/multi-word-component-names": [
+      "error",
+      {
+        ignores: ["Container", "Presentation"],
+      },
+    ],
+    "import/order": "error",
+  },
+  overrides: [
+    {
+      files: ["*.ts", "*.mts"],
+      parser: "@typescript-eslint/parser",
+      extends: ["plugin:@typescript-eslint/recommended-type-checked"],
+      parserOptions: tsEslintOptions,
+      rules: tsEslintRules,
+    },
+    {
+      files: ["*.vue"],
+      parser: vueEslintParser,
+      parserOptions: { ...vueEslintParserOptions, ...tsEslintOptions },
+      extends: ["plugin:@typescript-eslint/recommended-type-checked"],
+      rules: {
+        ...tsEslintRules,
+
+        // typescript-eslintにVueの型がanyとして認識されるので無効化
+        "@typescript-eslint/no-unsafe-member-access": "off",
+        "@typescript-eslint/no-unsafe-call": "off",
+        "@typescript-eslint/no-unsafe-assignment": "off",
+        "@typescript-eslint/no-unsafe-argument": "off",
+        "@typescript-eslint/no-unsafe-return": "off",
+        "@typescript-eslint/no-redundant-type-constituents": "off",
+      },
+    },
+  ],
+};

.github/workflows/update_pages.yml

@@ -0,0 +1,58 @@
+name: "Update Pages"
+on:
+  push:
+    branches:
+      - main
+  workflow_dispatch:
+
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  update_pages:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        run: corepack enable
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "pnpm"
+
+      - name: Install Dependencies
+        run: |
+          pnpm install
+
+      - name: Build Pages
+        run: |
+          pnpm run collect
+
+          pnpm run build --base /preview-pages
+        env:
+          APP_ID: ${{ secrets.APP_ID }}
+          CLIENT_ID: ${{ secrets.CLIENT_ID }}
+          CLIENT_SECRET: ${{ secrets.CLIENT_SECRET }}
+          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: "./dist"
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+private-key.pem
+public/preview/*
+!public/preview/.gitkeep

.npmrc

@@ -0,0 +1 @@
+@jsr:registry=https://npm.jsr.io

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 VOICEVOX
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,61 @@
+# VOICEVOX Preview Pages
+
+[voicevox/voicevox](https://github.com/voicevox/voicevox) のプレビューページを提供するためのリポジトリです。  
+対象ブランチ：
+
+- `main`
+- `project-*`
+- プルリクエスト
+
+## 動かす
+
+1. GitHub Appsを作成します。
+
+権限は以下の通りです：
+
+- Pull requests：Read & write
+
+### Actionsで動かす
+
+2. 作成したGitHub Appsの`Private key`を取得し、リポジトリの`Settings` > `Secrets` に`PRIVATE_KEY`として保存します。
+3. `.env.example` の内容をリポジトリの`Settings` > `Secrets` にキーごとに保存します。
+
+### ローカルで動かす
+
+2. 作成したGitHub Appsの`Private key`を取得し、`private-key.pem`として保存します。
+3. `.env.example` をコピーして `.env` を作成します。内容はコメントを参照してください。
+
+## 仕組み
+
+```mermaid
+sequenceDiagram
+    actor user as ユーザー
+    participant editor_fork as ユーザー/voicevox（フォーク）
+    participant editor_main as voicevox/voicevox（main）
+    participant preview_pages as voicevox/preview_pages
+
+    user->>editor_fork: PRを出す
+
+    note over editor_fork: ビルドを開始する
+    activate editor_fork
+
+    user-->>editor_main: pull_request_targetが発火する
+    editor_main->>+preview_pages: update_pages.ymlを発火させる
+
+    loop 
+        preview_pages->>editor_fork: Jobの終了を問い合わせる
+        editor_fork->>preview_pages: 
+    end
+
+    note over editor_fork: ビルドが完了する
+    deactivate editor_fork
+    preview_pages->>editor_fork: Artifactをダウンロードする
+    editor_fork->>preview_pages: 
+
+    note over preview_pages: Pagesにデプロイする
+    deactivate preview_pages
+```
+
+## ライセンス
+
+[LICENSE](LICENSE) を参照してください。

index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="ja">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Voicevox Preview</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package.json

@@ -0,0 +1,48 @@
+{
+  "name": "editor-preview",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "packageManager": "pnpm@9.12.3",
+  "scripts": {
+    "lint": "eslint --ext .js,.vue,.ts,.mts *.config.* src scripts",
+    "fmt": "eslint --ext .js,.vue,.ts,.mts *.config.* src scripts --fix",
+    "collect": "tsx scripts/collect.ts",
+    "dev": "vite",
+    "build": "vue-tsc -b && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@core/asyncutil": "npm:@jsr/core__asyncutil@1.2.0",
+    "@logtape/logtape": "0.7.1",
+    "element-plus": "2.8.7",
+    "vue": "3.5.12"
+  },
+  "devDependencies": {
+    "@octokit/plugin-paginate-rest": "11.3.5",
+    "@octokit/types": "13.6.1",
+    "@types/node": "22.9.0",
+    "@types/unzip-stream": "0.3.4",
+    "@typescript-eslint/eslint-plugin": "7.15.0",
+    "@typescript-eslint/parser": "7.15.0",
+    "@typescript-eslint/types": "7.15.0",
+    "@typescript-eslint/utils": "7.15.0",
+    "@vitejs/plugin-vue": "5.1.4",
+    "@vue/eslint-config-prettier": "9.0.0",
+    "@vue/eslint-config-typescript": "13.0.0",
+    "dotenv": "16.4.5",
+    "eslint": "8.57.1",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-import": "2.29.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.26.0",
+    "octokit": "4.0.2",
+    "prettier": "3.2.5",
+    "sass-embedded": "1.80.6",
+    "tsx": "4.19.2",
+    "typescript": "5.6.2",
+    "unzip-stream": "0.3.4",
+    "vite": "5.4.10",
+    "vue-tsc": "2.1.8"
+  }
+}