Skip to content

Commit 970aedc

Browse files
BLamyBLamy
committed
gh-pages coi-serviceworker hack?
1 parent 30e711b commit 970aedc

26 files changed

+1151
-8526
lines changed

‎.DS_Store‎

8 KB
Binary file not shown.

‎.github/dependabot.yml‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
version: 2
2+
updates:
3+
- package-ecosystem: "github-actions"
4+
directory: "/"
5+
schedule:
6+
interval: "weekly"
7+
open-pull-requests-limit: 10
8+
9+
- package-ecosystem: "npm"
10+
directory: "/"
11+
schedule:
12+
interval: "weekly"
13+
open-pull-requests-limit: 10

‎.github/workflows/storybook.yml‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
name: Deploy Storybook to GitHub Pages
2+
3+
on:
4+
# Runs on pushes targeting the default branch
5+
push:
6+
branches: ['main']
7+
8+
# Allows you to run this workflow manually from the Actions tab
9+
workflow_dispatch:
10+
11+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
12+
permissions:
13+
contents: read
14+
pages: write
15+
id-token: write
16+
17+
# Allow only one concurrent deployment
18+
concurrency:
19+
group: 'pages'
20+
cancel-in-progress: true
21+
22+
jobs:
23+
# Build job
24+
build:
25+
runs-on: ubuntu-latest
26+
steps:
27+
- name: Checkout
28+
uses: actions/checkout@v4
29+
30+
- name: Setup Node.js
31+
uses: actions/setup-node@v4
32+
with:
33+
node-version: '18'
34+
cache: npm
35+
36+
- name: Install dependencies
37+
run: npm install
38+
39+
- name: Build Storybook
40+
run: npm run build-storybook
41+
42+
- name: Setup Pages
43+
uses: actions/configure-pages@v4
44+
45+
- name: Upload artifact
46+
uses: actions/upload-pages-artifact@v3
47+
with:
48+
path: './storybook-static'
49+
50+
# Deployment job
51+
deploy:
52+
environment:
53+
name: github-pages
54+
url: ${{ steps.deployment.outputs.page_url }}
55+
runs-on: ubuntu-latest
56+
needs: build
57+
steps:
58+
- name: Deploy to GitHub Pages
59+
id: deployment
60+
uses: actions/deploy-pages@v4

‎.gitignore‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
node_modules
2+
.env
3+
.env.local
4+
.env.development.local
5+
.env.test.local
6+
.env.production.local
7+
.yarn

‎.postcssrc‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"plugins": {
3+
"@tailwindcss/postcss": {}
4+
}
5+
}

‎.storybook/_headers‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/*
2+
Cross-Origin-Opener-Policy: same-origin
3+
Cross-Origin-Embedder-Policy: require-corp
4+
*/

‎.storybook/ensure-headers.js‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
/**
2+
* This script ensures all HTML files in the build directory have
3+
* the proper headers for SharedArrayBuffer support
4+
*/
5+
6+
const fs = require('fs');
7+
const path = require('path');
8+
9+
// Directory containing built files
10+
const buildDir = path.resolve(__dirname, '../storybook-static');
11+
12+
// Helper to check if a file is HTML
13+
const isHtmlFile = (filename) => filename.endsWith('.html');
14+
15+
// Headers meta tags to insert
16+
const headersTags = `
17+
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin" />
18+
<meta http-equiv="Cross-Origin-Embedder-Policy" content="require-corp" />
19+
`;
20+
21+
// Process all HTML files in the build directory
22+
function processDirectory(dirPath) {
23+
const files = fs.readdirSync(dirPath);
24+
25+
files.forEach(file => {
26+
const filePath = path.join(dirPath, file);
27+
const stat = fs.statSync(filePath);
28+
29+
if (stat.isDirectory()) {
30+
// Recursively process subdirectories
31+
processDirectory(filePath);
32+
} else if (isHtmlFile(file)) {
33+
// Process HTML file
34+
addHeadersToHtmlFile(filePath);
35+
}
36+
});
37+
}
38+
39+
// Add headers to HTML file if they don't exist
40+
function addHeadersToHtmlFile(filePath) {
41+
console.log(`Processing ${filePath}`);
42+
let content = fs.readFileSync(filePath, 'utf8');
43+
44+
// Only add headers if they don't already exist
45+
if (!content.includes('Cross-Origin-Opener-Policy')) {
46+
content = content.replace('<head>', `<head>${headersTags}`);
47+
fs.writeFileSync(filePath, content);
48+
console.log(` - Added headers to ${path.basename(filePath)}`);
49+
} else {
50+
console.log(` - Headers already exist in ${path.basename(filePath)}`);
51+
}
52+
}
53+
54+
// Start processing
55+
console.log('Ensuring headers in HTML files...');
56+
processDirectory(buildDir);
57+
console.log('Done!');

‎.storybook/main.js‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
const excludedProps = new Set([
2+
'id',
3+
'slot',
4+
'onCopy',
5+
'onCut',
6+
'onPaste',
7+
'onCompositionStart',
8+
'onCompositionEnd',
9+
'onCompositionUpdate',
10+
'onSelect',
11+
'onBeforeInput',
12+
'onInput'
13+
]);
14+
15+
import sharedArrayBufferPlugin from './shared-array-buffer-plugin';
16+
17+
/** @type { import('@storybook/react-vite').StorybookConfig } */
18+
const config = {
19+
stories: [
20+
"../stories/**/*.mdx",
21+
"../stories/**/Chat.stories.@(js|jsx|mjs|ts|tsx)",
22+
"../stories/**/ModelContextProtocol.stories.@(js|jsx|mjs|ts|tsx)",
23+
"../stories/WebContainer.stories.tsx",
24+
],
25+
addons: [
26+
"@storybook/addon-links",
27+
"@storybook/addon-essentials",
28+
"@storybook/addon-onboarding",
29+
"@storybook/addon-interactions",
30+
],
31+
framework: {
32+
name: "@storybook/react-vite",
33+
options: {
34+
builder: {
35+
viteConfigPath: 'vite.config.js',
36+
},
37+
},
38+
},
39+
docs: {
40+
autodocs: "tag",
41+
},
42+
typescript: {
43+
reactDocgen: 'react-docgen-typescript',
44+
reactDocgenTypescriptOptions: {
45+
shouldExtractLiteralValuesFromEnum: true,
46+
compilerOptions: {
47+
allowSyntheticDefaultImports: false,
48+
esModuleInterop: false,
49+
},
50+
propFilter: (prop) => !prop.name.startsWith('aria-') && !excludedProps.has(prop.name),
51+
},
52+
},
53+
staticDirs: ['../public'],
54+
async viteFinal(config, { configType }) {
55+
// Add headers for SharedArrayBuffer support
56+
if (configType === 'DEVELOPMENT') {
57+
// Add server configuration
58+
config.server = config.server || {};
59+
config.server.headers = {
60+
'Cross-Origin-Opener-Policy': 'same-origin',
61+
'Cross-Origin-Embedder-Policy': 'require-corp',
62+
};
63+
}
64+
65+
// For both DEVELOPMENT and PRODUCTION modes
66+
// Handle "use client" directives
67+
config.build = config.build || {};
68+
config.build.rollupOptions = config.build.rollupOptions || {};
69+
70+
// Handle GitHub Pages deployment - add base path if needed
71+
if (configType === 'PRODUCTION') {
72+
// Check for GitHub Pages environment
73+
const isGitHubPages = process.env.GITHUB_ACTIONS === 'true';
74+
75+
if (isGitHubPages) {
76+
// Get repository name from GitHub context or use a fallback
77+
const repositoryName = process.env.GITHUB_REPOSITORY?.split('/')[1] || '';
78+
79+
if (repositoryName) {
80+
console.log(`GitHub Pages detected, setting base path to /${repositoryName}/`);
81+
config.base = `/${repositoryName}/`;
82+
}
83+
}
84+
}
85+
86+
// Add custom Rollup plugin to inject headers into HTML files
87+
config.plugins = config.plugins || [];
88+
89+
// Add our SharedArrayBuffer plugin that works in both dev and production
90+
config.plugins.push(sharedArrayBufferPlugin());
91+
92+
// Ignore "use client" directive warnings
93+
config.build.rollupOptions.onwarn = (warning, defaultHandler) => {
94+
if (warning.code === 'MODULE_LEVEL_DIRECTIVE' &&
95+
warning.message.includes('"use client"')) {
96+
return;
97+
}
98+
if (defaultHandler) defaultHandler(warning);
99+
};
100+
101+
return config;
102+
},
103+
};
104+
export default config;

‎.storybook/manager-head.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<!-- This content is injected into the manager head -->
2+
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin" />
3+
<meta http-equiv="Cross-Origin-Embedder-Policy" content="require-corp" />
4+
<meta http-equiv="Content-Security-Policy" content="worker-src 'self' blob:; default-src 'self'; connect-src *; img-src * data:; script-src * 'unsafe-eval' 'unsafe-inline'; style-src * 'unsafe-inline';" />

‎.storybook/middleware.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/**
2+
* Middleware for adding SharedArrayBuffer headers
3+
*/
4+
module.exports = function expressMiddleware(router) {
5+
router.use(function (req, res, next) {
6+
// Add COOP and COEP headers for SharedArrayBuffer support
7+
res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
8+
res.setHeader('Cross-Origin-Embedder-Policy', 'require-corp');
9+
next();
10+
});
11+
};

0 commit comments

Comments
 (0)