update

.github/workflows/build.yml

@@ -15,6 +15,7 @@ jobs:
 
       - name: Install dependencies
         run: |
+          npm i corepack@latest -g
           corepack enable pnpm
           pnpm i
 

.github/workflows/playwright.yml

@@ -32,18 +32,24 @@ jobs:
 
     - name: Install dependencies
       run: |
+        npm i corepack@latest -g
         corepack enable pnpm
         pnpm i
 
+    - name: build project
+      run: pnpm build
+
     - name: Install Playwright Browsers
+      working-directory: app
       run: pnpm exec playwright install --with-deps ${{ matrix.browser }}
 
     - name: Run Playwright tests
+      working-directory: app
       run: pnpm exec playwright test --project=${{ matrix.project }}
 
     - uses: actions/upload-artifact@v4
       if: always()
       with:
         name: playwright-report-${{ matrix.project }}
-        path: playwright-report/
+        path: app/playwright-report/
         retention-days: 30

.gitignore

@@ -29,5 +29,6 @@ package-lock.yaml
 .wrangler
 test-results
 playwright-report
+storybook-static
 
 dev-dist

.storybook/main.ts → app/.storybook/main.ts

@@ -1,13 +1,11 @@
 import type { StorybookConfig } from '@storybook/react-vite'
 const config: StorybookConfig = {
-    stories: ['../src/**/*.stories.ts', "../src/**/*.stories.tsx"],
+    stories: ['../src/**/*.stories.ts', '../src/**/*.stories.tsx'],
     addons: ['@storybook/addon-essentials'],
     framework: {
         name: '@storybook/react-vite',
         options: {}
     },
-    docs: {
-        autodocs: 'tag'
-    }
+    docs: {}
 }
 export default config

app/.storybook/preview.tsx

@@ -0,0 +1,70 @@
+import React from 'react'
+import { Preview } from '@storybook/react'
+import { Themes, loadConcurrentTheme } from '../src/themes'
+import { Box, CssBaseline, Paper, ThemeProvider, Typography } from '@mui/material'
+
+const themeNames = Object.keys(Themes)
+
+const preview: Preview = {
+    parameters: {
+        layout: 'fullscreen'
+    },
+    globalTypes: {
+        theme: {
+            description: 'Global theme for components',
+            defaultValue: 'All',
+            toolbar: {
+                title: 'Theme',
+                icon: 'circlehollow',
+                dynamicTitle: true,
+                items: ['All', ...themeNames]
+            }
+        }
+    },
+    decorators: [
+        (StoryFn, context) => {
+            const themeName = context.globals.theme
+            const previewTarget = Array()
+            if (themeName === 'All') {
+                themeNames.forEach((themeName) => {
+                    previewTarget.push(loadConcurrentTheme(themeName, {}))
+                })
+            } else {
+                previewTarget.push(loadConcurrentTheme(themeName, {}))
+            }
+            return (
+                <Box
+                    sx={{
+                        display: 'flex',
+                        flexDirection: 'column',
+                        height: '100vh'
+                    }}
+                >
+                    {previewTarget.map((theme) => (
+                        <ThemeProvider theme={theme}>
+                            <CssBaseline />
+                            <Box
+                                sx={{
+                                    backgroundColor: 'background.default',
+                                    p: 2,
+                                    flex: 1
+                                }}
+                            >
+                                <Paper
+                                    sx={{
+                                        p: 2
+                                    }}
+                                >
+                                    <Typography>{theme.meta.name}</Typography>
+                                    <StoryFn />
+                                </Paper>
+                            </Box>
+                        </ThemeProvider>
+                    ))}
+                </Box>
+            )
+        }
+    ]
+}
+
+export default preview

app/dist

@@ -0,0 +1 @@
+../dist

index.html → app/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <!--
     ______                            __
    / ____/___  ____  ______________  / /_
@@ -13,25 +13,38 @@
     <head>
         <meta charset="UTF-8" />
         <link rel="icon" type="image/icon" href="/favicon.ico" />
-        <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-        <link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet">
+        <meta
+            name="viewport"
+            content="viewport-fit=cover, width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
+        />
+        <link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet" />
         <title>Concrnt | コンカレント</title>
-        <meta name="description" content="Concrntはあなたの世界をちょっとだけより豊かにする、新しい時代のSNSです" data-rh="true" />
+        <meta
+            name="description"
+            content="Concrntはあなたの世界をちょっとだけより豊かにする、新しい時代のSNSです"
+            data-rh="true"
+        />
         <meta property="og:title" content="Concrnt | コンカレント" />
-        <meta property="og:description" content="Concrntはあなたの世界をちょっとだけより豊かにする、新しい時代のSNSです" />
+        <meta
+            property="og:description"
+            content="Concrntはあなたの世界をちょっとだけより豊かにする、新しい時代のSNSです"
+        />
         <meta property="og:type" content="website" />
-        <meta property="og:url" content="https://concrnt.world/" /><meta property="og:image" content="https://concrnt.world/concrnt.png"/>
+        <meta property="og:url" content="https://concrnt.world/" />
+        <meta property="og:image" content="https://concrnt.world/concrnt.png" />
         <!-- Google tag (gtag.js) -->
         <script async src="https://www.googletagmanager.com/gtag/js?id=G-Y4V0V7XYWX"></script>
         <script>
-            window.dataLayer = window.dataLayer || [];
-            function gtag(){dataLayer.push(arguments);}
-            gtag('js', new Date());
+            window.dataLayer = window.dataLayer || []
+            function gtag() {
+                dataLayer.push(arguments)
+            }
+            gtag('js', new Date())
 
             gtag('config', 'G-Y4V0V7XYWX', {
                 //debug_mode: true,
                 send_page_view: false
-            });
+            })
         </script>
     </head>
     <body>

app/package.json

@@ -0,0 +1,108 @@
+{
+  "name": "concrnt-world",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "pnpm prebuild && tsc && vite build && pnpm postbuild",
+    "postbuild": "touch dist/.gitkeep",
+    "prebuild": "./prebuild.sh",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "test": "playwright test --project=chromium",
+    "test-all": "playwright test"
+  },
+  "dependencies": {
+    "@aws-sdk/client-s3": "^3.592.0",
+    "@aws-sdk/s3-request-presigner": "^3.592.0",
+    "@concrnt/worldlib": "workspace:*",
+    "@cosmjs/encoding": "^0.32.4",
+    "@cosmjs/proto-signing": "^0.32.4",
+    "@cosmjs/stargate": "^0.32.4",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "@fortawesome/free-brands-svg-icons": "^6.7.2",
+    "@fortawesome/react-fontawesome": "^0.2.2",
+    "@google/model-viewer": "^4.0.0",
+    "@mui/icons-material": "^6.4.3",
+    "@mui/material": "^6.4.3",
+    "@rjsf/core": "^5.24.3",
+    "@rjsf/mui": "^5.24.3",
+    "@rjsf/utils": "^5.24.3",
+    "@rjsf/validator-ajv8": "^5.24.3",
+    "@zxing/browser": "^0.1.4",
+    "@zxing/library": "^0.20.0",
+    "blurhash": "^2.0.5",
+    "boring-avatars": "github:totegamma/boring-avatars#49ed345027665e1d6135ae6b0b6f2a442ff52915",
+    "cosmjs-types": "^0.9.0",
+    "elliptic": "^6.5.4",
+    "ethers": "^6.3.0",
+    "fuzzysort": "^2.0.4",
+    "html2canvas": "^1.4.1",
+    "i18next": "^23.5.1",
+    "i18next-browser-languagedetector": "^7.1.0",
+    "i18next-http-backend": "^2.2.2",
+    "json-schema-to-typescript": "^13.0.1",
+    "jspdf": "^2.5.1",
+    "notistack": "^3.0.1",
+    "protobufjs": "^7.3.2",
+    "react": "^18.2.0",
+    "react-blurhash": "^0.3.0",
+    "react-colorful": "^5.6.1",
+    "react-dom": "^18.2.0",
+    "react-error-boundary": "^4.0.10",
+    "react-helmet-async": "^2.0.5",
+    "react-i18next": "^13.2.2",
+    "react-icons": "^5.2.1",
+    "react-markdown": "^8.0.7",
+    "react-parallax-tilt": "^1.7.146",
+    "react-qr-code": "^2.0.12",
+    "react-router-dom": "^6.11.0",
+    "react-syntax-highlighter": "^15.5.0",
+    "react-use-websocket": "^4.3.1",
+    "react-zoom-pan-pinch": "^3.4.2",
+    "rehype-raw": "^6.1.1",
+    "rehype-sanitize": "^5.0.1",
+    "remark-breaks": "^3.0.2",
+    "textarea-caret": "^3.1.0",
+    "unist-util-inspect": "^8.0.0",
+    "unist-util-visit": "^5.0.0",
+    "unplugin-info": "^1.2.1",
+    "use-sound": "^4.0.1",
+    "uuid": "^9.0.0",
+    "virtua": "^0.33.5",
+    "vite": "^6.0.11",
+    "vite-plugin-pwa": "^0.21.1"
+  },
+  "devDependencies": {
+    "@keplr-wallet/types": "^0.12.114",
+    "@playwright/test": "^1.46.1",
+    "@storybook/addon-essentials": "^8.5.3",
+    "@storybook/react": "^8.5.3",
+    "@storybook/react-vite": "^8.5.3",
+    "@types/elliptic": "^6.4.14",
+    "@types/node-forge": "^1.3.1",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.9",
+    "@types/react-syntax-highlighter": "^15.5.6",
+    "@types/textarea-caret": "^3.0.1",
+    "@types/uuid": "^9.0.1",
+    "@types/ws": "^8.5.4",
+    "@vitejs/plugin-react-swc": "^3.7.2",
+    "preset": "link:@storybook/react-vite/preset",
+    "prop-types": "15.8.1",
+    "rollup-plugin-visualizer": "^5.14.0",
+    "storybook": "^8.5.3",
+    "workbox-precaching": "^7.3.0"
+  },
+  "packageManager": "pnpm@8.6.1",
+  "volta": {
+    "node": "22.12.0"
+  },
+  "eslintConfig": {
+    "extends": [
+      "plugin:storybook/recommended"
+    ]
+  }
+}