dh-remixer-sdk 0.0.28-6c514b2 → 0.0.28-84faf0a
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/scripts/sdk-update/cmd-utils.mjs +22 -4
- package/scripts/sdk-update/sdk-utils.mjs +13 -0
- package/scripts/ssg-helmet/prerenderer.mjs +9 -0
- package/templates/base/SEOHead.tsx +43 -0
- package/templates/base/cloud.ts +127 -0
- package/templates/base/filemap.json +2 -1
- package/templates/base/index.tsx +7 -4
- package/templates/base/package.json +2 -2
- package/templates/base/supabase.ts +21 -10
- package/templates/base/vite.config.ts +42 -148
- package/templates/ecommerce/supabase.ts +21 -10
- package/templates/immersive/Anchor3D.tsx +62 -0
- package/templates/immersive/Atmosphere.tsx +134 -0
- package/templates/immersive/ImmersiveStory.tsx +130 -0
- package/templates/immersive/ScrollStory.tsx +136 -0
- package/templates/immersive/Stage3D.tsx +194 -0
- package/templates/immersive/StageContext.ts +37 -0
- package/templates/immersive/anchors.tsx +77 -0
- package/templates/immersive/cleanup.json +22 -0
- package/templates/immersive/filemap.json +13 -0
- package/templates/immersive/package.json +13 -0
- package/templates/immersive/phases.ts +154 -0
- package/templates/immersive/safeCanvas.tsx +82 -0
- package/templates/immersive/stage.ts +5 -0
- package/templates/immersive/useAnchor.ts +13 -0
- package/templates/landing-page/package.json +1 -1
package/package.json
CHANGED
|
@@ -1,13 +1,31 @@
|
|
|
1
1
|
import { spawn } from "child_process";
|
|
2
2
|
import { TARGET_ENVIRONMENT } from "./vars.mjs";
|
|
3
3
|
|
|
4
|
+
const TAG_BY_ENV = {
|
|
5
|
+
production: "latest",
|
|
6
|
+
staging: "staging",
|
|
7
|
+
develop: "develop",
|
|
8
|
+
};
|
|
9
|
+
|
|
4
10
|
export async function getSdkVersion() {
|
|
11
|
+
const tag = TAG_BY_ENV[TARGET_ENVIRONMENT];
|
|
12
|
+
|
|
13
|
+
if (!tag) {
|
|
14
|
+
throw new Error(
|
|
15
|
+
`[sdk-update] Unknown NEXT_PUBLIC_ENVIRONMENT "${TARGET_ENVIRONMENT}". ` +
|
|
16
|
+
`Expected one of: ${Object.keys(TAG_BY_ENV).join(", ")}`,
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
|
|
5
20
|
const res = await fetch("https://registry.npmjs.org/dh-remixer-sdk");
|
|
6
21
|
const data = await res.json();
|
|
7
|
-
const sdkVersion =
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
22
|
+
const sdkVersion = data["dist-tags"]?.[tag];
|
|
23
|
+
|
|
24
|
+
if (!sdkVersion) {
|
|
25
|
+
throw new Error(
|
|
26
|
+
`[sdk-update] No "${tag}" dist-tag published for dh-remixer-sdk on npm`,
|
|
27
|
+
);
|
|
28
|
+
}
|
|
11
29
|
|
|
12
30
|
return sdkVersion;
|
|
13
31
|
}
|
|
@@ -5,7 +5,19 @@ import { SDK_ROOT } from "./vars.mjs";
|
|
|
5
5
|
import { jsonMerge } from "./type-utils.mjs";
|
|
6
6
|
|
|
7
7
|
|
|
8
|
+
function assertTemplateExists(templateType) {
|
|
9
|
+
if (templateType === "base") return;
|
|
10
|
+
const templateRoot = path.join(SDK_ROOT, "templates", templateType);
|
|
11
|
+
if (!fssync.existsSync(templateRoot)) {
|
|
12
|
+
throw new Error(
|
|
13
|
+
`[sdk-update] Template "${templateType}" not found in installed dh-remixer-sdk (${templateRoot}). ` +
|
|
14
|
+
`Run: npm install dh-remixer-sdk@latest`,
|
|
15
|
+
);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
8
19
|
export async function getDeletionList(templateType) {
|
|
20
|
+
assertTemplateExists(templateType);
|
|
9
21
|
const baseRoot = path.join(SDK_ROOT, "templates", "base");
|
|
10
22
|
const templateRoot = path.join(SDK_ROOT, "templates", templateType);
|
|
11
23
|
const templateCleanupPath = path.join(templateRoot, "cleanup.json");
|
|
@@ -23,6 +35,7 @@ export async function getDeletionList(templateType) {
|
|
|
23
35
|
}
|
|
24
36
|
|
|
25
37
|
export async function getExtractionList(templateType) {
|
|
38
|
+
assertTemplateExists(templateType);
|
|
26
39
|
const baseRoot = path.join(SDK_ROOT, "templates", "base");
|
|
27
40
|
const templateRoot = path.join(SDK_ROOT, "templates", templateType);
|
|
28
41
|
const templateFilemapPath = path.join(templateRoot, "filemap.json");
|
|
@@ -202,6 +202,15 @@ export class Prerenderer {
|
|
|
202
202
|
this.#client = await CDP({ port: this.#cdpPort, target: pageTarget });
|
|
203
203
|
await this.#client.Page.enable();
|
|
204
204
|
await this.#client.Runtime.enable();
|
|
205
|
+
|
|
206
|
+
// Signal to the app that we are in SSG prerender mode, BEFORE any page
|
|
207
|
+
// scripts run. Components (e.g. ScrollScene, useScrollProgress) can read
|
|
208
|
+
// window.__PRERENDER__ to skip WebGL/Lenis and render a static fallback,
|
|
209
|
+
// which keeps headless Chrome from hanging on canvas rendering and
|
|
210
|
+
// guarantees meaningful HTML for SEO.
|
|
211
|
+
await this.#client.Page.addScriptToEvaluateOnNewDocument({
|
|
212
|
+
source: "window.__PRERENDER__ = true;",
|
|
213
|
+
});
|
|
205
214
|
}
|
|
206
215
|
|
|
207
216
|
async #launchDirect() {
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { Helmet } from "react-helmet-async";
|
|
2
|
+
import { useLanguage } from "@/context/LanguageContext";
|
|
3
|
+
import images from "@/assets/images.json";
|
|
4
|
+
|
|
5
|
+
interface SEOHeadProps {
|
|
6
|
+
titleKey?: string;
|
|
7
|
+
descriptionKey?: string;
|
|
8
|
+
ogImage?: string;
|
|
9
|
+
ogImageKey?: string;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
// Canonical <head> for every page. Render exactly one <SEOHead /> per page
|
|
13
|
+
// inside pages/*.tsx; no raw <Helmet> anywhere else. Pulls og:image from
|
|
14
|
+
// assets/images.json by default so social sharing works without extra wiring.
|
|
15
|
+
export function SEOHead({
|
|
16
|
+
titleKey = "home.title",
|
|
17
|
+
descriptionKey = "home.description",
|
|
18
|
+
ogImage,
|
|
19
|
+
ogImageKey = "og_image",
|
|
20
|
+
}: SEOHeadProps) {
|
|
21
|
+
const { t } = useLanguage();
|
|
22
|
+
const siteTitle = import.meta.env.VITE_METADATA_TITLE as string | undefined;
|
|
23
|
+
const translated = t(titleKey);
|
|
24
|
+
const title = siteTitle ? `${translated} | ${siteTitle}` : translated;
|
|
25
|
+
const description = t(descriptionKey);
|
|
26
|
+
const resolvedOg =
|
|
27
|
+
ogImage ?? (images as Record<string, string>)[ogImageKey];
|
|
28
|
+
|
|
29
|
+
return (
|
|
30
|
+
<Helmet>
|
|
31
|
+
<title>{title}</title>
|
|
32
|
+
<meta name="description" content={description} />
|
|
33
|
+
<meta property="og:title" content={title} />
|
|
34
|
+
<meta property="og:description" content={description} />
|
|
35
|
+
<meta property="og:type" content="website" />
|
|
36
|
+
{resolvedOg ? <meta property="og:image" content={resolvedOg} /> : null}
|
|
37
|
+
<meta name="twitter:card" content="summary_large_image" />
|
|
38
|
+
{resolvedOg ? <meta name="twitter:image" content={resolvedOg} /> : null}
|
|
39
|
+
</Helmet>
|
|
40
|
+
);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export default SEOHead;
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import { authHeader } from './supabase';
|
|
2
|
+
|
|
3
|
+
type RemixerActionPayload = Record<string, unknown>;
|
|
4
|
+
|
|
5
|
+
type StorageUploadOptions = {
|
|
6
|
+
bucketSlug: string;
|
|
7
|
+
file: File;
|
|
8
|
+
objectKey?: string;
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
type StorageUploadForm = {
|
|
12
|
+
url: string;
|
|
13
|
+
fields: Record<string, string>;
|
|
14
|
+
objectId: string;
|
|
15
|
+
objectKey: string;
|
|
16
|
+
s3Key: string;
|
|
17
|
+
sha256: string;
|
|
18
|
+
expiresInSeconds: number;
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
type StorageObject = {
|
|
22
|
+
id: string;
|
|
23
|
+
objectId: string;
|
|
24
|
+
projectId: string;
|
|
25
|
+
bucketSlug: string;
|
|
26
|
+
objectKey: string;
|
|
27
|
+
originalFilename?: string | null;
|
|
28
|
+
contentType?: string | null;
|
|
29
|
+
sizeBytes: number;
|
|
30
|
+
sha256: string;
|
|
31
|
+
visibility: 'public' | 'private';
|
|
32
|
+
source: string;
|
|
33
|
+
createdAt: string;
|
|
34
|
+
updatedAt: string;
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
type StorageObjectPage = {
|
|
38
|
+
objects: StorageObject[];
|
|
39
|
+
nextCursor?: string | null;
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
type StorageReadUrlResponse = {
|
|
43
|
+
url: string;
|
|
44
|
+
expiresInSeconds: number;
|
|
45
|
+
object: StorageObject;
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
async function sha256Hex(file: File): Promise<string> {
|
|
49
|
+
const hashBuffer = await crypto.subtle.digest('SHA-256', await file.arrayBuffer());
|
|
50
|
+
return Array.from(new Uint8Array(hashBuffer))
|
|
51
|
+
.map(byte => byte.toString(16).padStart(2, '0'))
|
|
52
|
+
.join('');
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
async function runtimeFetch<T>(path: string, body: RemixerActionPayload): Promise<T> {
|
|
56
|
+
const headers = await authHeader();
|
|
57
|
+
const response = await fetch(`${import.meta.env.VITE_SUPABASE_URL}/functions/v1/${path}`, {
|
|
58
|
+
method: 'POST',
|
|
59
|
+
headers: {
|
|
60
|
+
...headers,
|
|
61
|
+
'Content-Type': 'application/json',
|
|
62
|
+
},
|
|
63
|
+
body: JSON.stringify(body),
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
if (!response.ok) {
|
|
67
|
+
const error = await response.json().catch(() => ({}));
|
|
68
|
+
throw new Error(error.message || error.error || `Remixer runtime request failed (${response.status})`);
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
return response.json();
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
export async function runRemixerAction<T = unknown>(actionName: string, payload: RemixerActionPayload = {}): Promise<T> {
|
|
75
|
+
return runtimeFetch<T>('remixer-runtime/action', { actionName, payload });
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
export async function uploadRemixerFile({ bucketSlug, file, objectKey }: StorageUploadOptions): Promise<StorageObject> {
|
|
79
|
+
const contentType = file.type || 'application/octet-stream';
|
|
80
|
+
const sha256 = await sha256Hex(file);
|
|
81
|
+
const upload = await runtimeFetch<StorageUploadForm>('remixer-runtime/storage/upload-url', {
|
|
82
|
+
bucketSlug,
|
|
83
|
+
filename: file.name,
|
|
84
|
+
contentType,
|
|
85
|
+
sizeBytes: file.size,
|
|
86
|
+
sha256,
|
|
87
|
+
objectKey,
|
|
88
|
+
});
|
|
89
|
+
|
|
90
|
+
const formData = new FormData();
|
|
91
|
+
Object.entries(upload.fields).forEach(([key, value]) => formData.append(key, value));
|
|
92
|
+
formData.append('file', file);
|
|
93
|
+
|
|
94
|
+
const response = await fetch(upload.url, {
|
|
95
|
+
method: 'POST',
|
|
96
|
+
body: formData,
|
|
97
|
+
});
|
|
98
|
+
|
|
99
|
+
if (!response.ok) {
|
|
100
|
+
throw new Error(`File upload failed (${response.status})`);
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
return runtimeFetch<StorageObject>('remixer-runtime/storage/complete-upload', {
|
|
104
|
+
bucketSlug,
|
|
105
|
+
objectId: upload.objectId,
|
|
106
|
+
filename: file.name,
|
|
107
|
+
contentType,
|
|
108
|
+
sizeBytes: file.size,
|
|
109
|
+
sha256,
|
|
110
|
+
objectKey: upload.objectKey,
|
|
111
|
+
s3Key: upload.s3Key,
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
export async function listRemixerFiles(bucketSlug: string, options: { prefix?: string; limit?: number; cursor?: string | null } = {}) {
|
|
116
|
+
return runtimeFetch<StorageObjectPage>('remixer-runtime/storage/objects', {
|
|
117
|
+
bucketSlug,
|
|
118
|
+
...options,
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
export async function getRemixerFileReadUrl(bucketSlug: string, object: { objectId?: string; objectKey?: string }) {
|
|
123
|
+
return runtimeFetch<StorageReadUrlResponse>('remixer-runtime/storage/read-url', {
|
|
124
|
+
bucketSlug,
|
|
125
|
+
...object,
|
|
126
|
+
});
|
|
127
|
+
}
|
package/templates/base/index.tsx
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import ReactDOM from "react-dom/client";
|
|
3
|
+
import { HelmetProvider } from "react-helmet-async";
|
|
3
4
|
import tailwindConfig from "@/tailwind.config";
|
|
4
5
|
import App from "@/App";
|
|
5
6
|
import { GOOGLE_FONTS_URL } from "@/fonts";
|
|
@@ -27,8 +28,10 @@ if (!rootElement) {
|
|
|
27
28
|
const root = ReactDOM.createRoot(rootElement);
|
|
28
29
|
root.render(
|
|
29
30
|
<React.StrictMode>
|
|
30
|
-
<
|
|
31
|
-
<
|
|
32
|
-
|
|
31
|
+
<HelmetProvider>
|
|
32
|
+
<LanguageProvider>
|
|
33
|
+
<App />
|
|
34
|
+
</LanguageProvider>
|
|
35
|
+
</HelmetProvider>
|
|
33
36
|
</React.StrictMode>
|
|
34
|
-
);
|
|
37
|
+
);
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"start": "vite preview --host 0.0.0.0 --mode production --port ${PORT:-4173}",
|
|
9
9
|
"dev": "vite --host 0.0.0.0 --port ${PORT:-4173} --mode development",
|
|
10
10
|
"lint": "echo 'Linting not implemented!'",
|
|
11
|
-
"remixer-sdk:update": "
|
|
11
|
+
"remixer-sdk:update": "bun install dh-remixer-sdk@${REMIXER_SDK_TAG:-latest} && sdk-update"
|
|
12
12
|
},
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"@openobserve/browser-logs": "0.3.1",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"react": "19.2.0",
|
|
22
22
|
"react-aria-components": "1.11.0",
|
|
23
23
|
"react-dom": "19.2.0",
|
|
24
|
-
"react-helmet": "
|
|
24
|
+
"react-helmet-async": "3.0.0",
|
|
25
25
|
"react-router-dom": "7.9.6"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
import { createClient } from '@supabase/supabase-js';
|
|
3
|
+
import type { Session } from '@supabase/supabase-js';
|
|
3
4
|
|
|
4
5
|
/**
|
|
5
6
|
* 1) supabase — user-scoped client
|
|
@@ -35,6 +36,25 @@ export const supabaseProject = createClient(
|
|
|
35
36
|
}
|
|
36
37
|
);
|
|
37
38
|
|
|
39
|
+
export function isValidProjectSession(session: Session | null) {
|
|
40
|
+
if (!session) return true;
|
|
41
|
+
const sessionProjectId = session?.user?.app_metadata?.project_id;
|
|
42
|
+
return sessionProjectId === import.meta.env.VITE_PROJECT_ID;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
export async function getProjectSession() {
|
|
46
|
+
const {
|
|
47
|
+
data: { session },
|
|
48
|
+
} = await supabase.auth.getSession();
|
|
49
|
+
|
|
50
|
+
if (!isValidProjectSession(session)) {
|
|
51
|
+
await supabase.auth.signOut({ scope: 'local' });
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
return session;
|
|
56
|
+
}
|
|
57
|
+
|
|
38
58
|
/**
|
|
39
59
|
* authHeader() — helper for manual fetch() calls (Edge Functions/REST)
|
|
40
60
|
* • Returns `{ Authorization: 'Bearer <token>' }` where `<token>` is:
|
|
@@ -45,16 +65,7 @@ export const supabaseProject = createClient(
|
|
|
45
65
|
* time — no client-side updateUser() needed.
|
|
46
66
|
*/
|
|
47
67
|
export async function authHeader() {
|
|
48
|
-
const
|
|
49
|
-
data: { session },
|
|
50
|
-
} = await supabase.auth.getSession();
|
|
51
|
-
|
|
52
|
-
if (session?.user?.app_metadata?.project_id &&
|
|
53
|
-
session.user.app_metadata.project_id !== import.meta.env.VITE_PROJECT_ID) {
|
|
54
|
-
await supabase.auth.signOut({ scope: 'local' });
|
|
55
|
-
return { Authorization: `Bearer ${import.meta.env.VITE_PROJECT_ACCESS_TOKEN}` };
|
|
56
|
-
}
|
|
57
|
-
|
|
68
|
+
const session = await getProjectSession();
|
|
58
69
|
const token =
|
|
59
70
|
session?.access_token ?? import.meta.env.VITE_PROJECT_ACCESS_TOKEN;
|
|
60
71
|
|
|
@@ -1,113 +1,10 @@
|
|
|
1
|
-
import { defineConfig, Plugin } from "vite";
|
|
1
|
+
import { defineConfig, loadEnv, Plugin } from "vite";
|
|
2
2
|
import react from "@vitejs/plugin-react";
|
|
3
3
|
import tailwindcss from "tailwindcss";
|
|
4
4
|
import autoprefixer from "autoprefixer";
|
|
5
5
|
import tailwindConfig from "./tailwind.config.ts";
|
|
6
6
|
import path from "path";
|
|
7
7
|
|
|
8
|
-
const REMIXER_LOGO_SVG = `
|
|
9
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
|
|
10
|
-
<path d="M18.0005 12.0025C14.6877 12.0025 12.0012 14.6889 12.0012 18.0016V24.0006H24.0024V12H18.0031L18.0005 12.0025Z" fill="url(#paint0_linear_14487_36369)"/>
|
|
11
|
-
<path d="M12.0012 5.99904V0H0V12.0006H5.99932C9.31215 12.0006 11.9986 9.31423 11.9986 6.00155L12.0012 5.99904Z" fill="url(#paint1_linear_14487_36369)"/>
|
|
12
|
-
<path d="M5.99902 11.999C9.31222 11.999 11.9988 14.6851 11.999 17.998C11.999 21.3112 9.31236 23.9971 5.99902 23.9971C2.68583 23.9969 0 21.3111 0 17.998C0.00021569 14.6852 2.68596 11.9992 5.99902 11.999ZM18 0C21.3133 0 24 2.68585 24 5.99902C24 9.3122 21.3133 11.998 18 11.998C14.6869 11.9978 12.001 9.31205 12.001 5.99902C12.001 2.68601 14.6869 0.00024737 18 0Z" fill="url(#paint2_linear_14487_36369)"/>
|
|
13
|
-
<path d="M12.0012 6H18.0005V11.999C14.6877 11.999 12.0012 9.31016 12.0012 6Z" fill="white"/>
|
|
14
|
-
<path d="M5.99927 12V6.00096H11.9986C11.9986 9.31364 9.30958 12 5.99927 12Z" fill="white"/>
|
|
15
|
-
<path d="M12.0012 18H6.0019L6.0019 12.001C9.31473 12.001 12.0012 14.6898 12.0012 18Z" fill="white"/>
|
|
16
|
-
<path d="M18.0005 12V17.999H12.0012C12.0012 14.6864 14.6902 12 18.0005 12Z" fill="white"/>
|
|
17
|
-
<defs>
|
|
18
|
-
<linearGradient id="paint0_linear_14487_36369" x1="12.0024" y1="12" x2="24.0018" y2="24" gradientUnits="userSpaceOnUse">
|
|
19
|
-
<stop stop-color="#3F3F46"/>
|
|
20
|
-
<stop offset="1" stop-color="#71717A"/>
|
|
21
|
-
</linearGradient>
|
|
22
|
-
<linearGradient id="paint1_linear_14487_36369" x1="0.001139" y1="3.18903e-07" x2="12.0005" y2="12" gradientUnits="userSpaceOnUse">
|
|
23
|
-
<stop stop-color="#71717A"/>
|
|
24
|
-
<stop offset="1" stop-color="#3F3F46"/>
|
|
25
|
-
</linearGradient>
|
|
26
|
-
<linearGradient id="paint2_linear_14487_36369" x1="-8.53364" y1="33.7017" x2="-6.30119" y2="-14.057" gradientUnits="userSpaceOnUse">
|
|
27
|
-
<stop stop-color="#BE59FF"/>
|
|
28
|
-
<stop offset="0.19" stop-color="#9D60FF"/>
|
|
29
|
-
<stop offset="0.74" stop-color="#4274FF"/>
|
|
30
|
-
<stop offset="1" stop-color="#1F7CFF"/>
|
|
31
|
-
</linearGradient>
|
|
32
|
-
</defs>
|
|
33
|
-
</svg>`
|
|
34
|
-
|
|
35
|
-
const ARROW_SVG = `
|
|
36
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
|
|
37
|
-
<path d="M11.1635 10.0004L7.60246 6.43958C7.48718 6.32417 7.42816 6.19646 7.42538 6.05646C7.42274 5.9166 7.48177 5.78625 7.60246 5.66542C7.72329 5.54472 7.85232 5.48438 7.98954 5.48438C8.12677 5.48438 8.25579 5.54472 8.37663 5.66542L12.2468 9.53563C12.3109 9.59979 12.3589 9.67167 12.391 9.75125C12.4231 9.83083 12.4391 9.91389 12.4391 10.0004C12.4391 10.0869 12.4231 10.17 12.391 10.2496C12.3589 10.3292 12.3109 10.401 12.2468 10.4652L8.37663 14.3354C8.26121 14.4507 8.13697 14.5063 8.00392 14.5021C7.871 14.4978 7.74413 14.4353 7.62329 14.3146C7.5026 14.1938 7.44225 14.0647 7.44225 13.9275C7.44225 13.7903 7.5026 13.6613 7.62329 13.5404L11.1635 10.0004Z" fill="#A18AFB" fill-opacity="0.7"/>
|
|
38
|
-
</svg>`
|
|
39
|
-
|
|
40
|
-
const BUILT_WITH_REMIXER_TEXT = (classes?: string) => `
|
|
41
|
-
<div class="flex gap-[12px] items-center">
|
|
42
|
-
${REMIXER_LOGO_SVG}
|
|
43
|
-
<p class="${classes} text-[#FFF] text-[14px] font-[400]">Built with <span class="font-[600]">Remixer</span></p>
|
|
44
|
-
</div>`
|
|
45
|
-
|
|
46
|
-
const CTA_LINK = (title: string, href: string, isShowArrow: boolean = false) => `
|
|
47
|
-
<a href="${href}" target="_blank" class="group text-[14px] text-[#B6A3FE] font-[600] flex gap-[6px] items-center cursor-pointer relative">
|
|
48
|
-
${title}
|
|
49
|
-
${isShowArrow ? ARROW_SVG : ''}
|
|
50
|
-
<div class="bg-[#B6A3FE] absolute left-0 bottom-0 h-[1px] right-[100%] transition-all duration-150 ${isShowArrow ? 'group-hover:right-[4px]' : 'group-hover:right-[0px]'}"></div>
|
|
51
|
-
</a>`
|
|
52
|
-
|
|
53
|
-
const BADGE_CONTAINER = (cta_links?: string) => `
|
|
54
|
-
<div class="fixed bottom-[0px] right-[0px] z-[2147483647] flex p-[8px] gap-[16px] mx-[16px] mb-[16px] bg-[#09090B] border-[#3F3F46] border-[1px] border-solid rounded-[12px] items-center shadow-[0_2px_32px_0_rgba(0,0,0,0.25)]">
|
|
55
|
-
<div class="flex gap-[12px] items-center">
|
|
56
|
-
${cta_links ?
|
|
57
|
-
[
|
|
58
|
-
BUILT_WITH_REMIXER_TEXT('hidden md:block'),
|
|
59
|
-
'<div class="h-[20px] w-[1px] bg-[#3F3F46]"></div>',
|
|
60
|
-
cta_links
|
|
61
|
-
].join('\n') :
|
|
62
|
-
BUILT_WITH_REMIXER_TEXT()
|
|
63
|
-
}
|
|
64
|
-
</div>
|
|
65
|
-
</div>`
|
|
66
|
-
|
|
67
|
-
const PREVIEW_DOMAINS = [
|
|
68
|
-
'.remixer.ai',
|
|
69
|
-
'.dreamhosters.ai',
|
|
70
|
-
];
|
|
71
|
-
|
|
72
|
-
function injectRemixerBadgePlugin(): Plugin {
|
|
73
|
-
return {
|
|
74
|
-
name: "vite-plugin-inject-remixer-badge",
|
|
75
|
-
apply: "build",
|
|
76
|
-
|
|
77
|
-
transformIndexHtml(html) {
|
|
78
|
-
try {
|
|
79
|
-
const IS_SHOW_REMIXER_BADGE: boolean = process.env.IS_SHOW_REMIXER_BADGE as boolean | undefined || false;
|
|
80
|
-
const REMIXER_BADGE_TYPE: string = process.env.REMIXER_BADGE_TYPE || 'DEFAULT';
|
|
81
|
-
|
|
82
|
-
const domain = process.env.NEXT_PUBLIC_DOMAIN || '';
|
|
83
|
-
const isPreviewService = PREVIEW_DOMAINS.some(pd => domain.endsWith(pd));
|
|
84
|
-
|
|
85
|
-
if (!IS_SHOW_REMIXER_BADGE && !isPreviewService) return html
|
|
86
|
-
|
|
87
|
-
const DICTIONARY: Record<string, string> = {
|
|
88
|
-
DEFAULT: BADGE_CONTAINER(),
|
|
89
|
-
UPGRADE_PLAN: BADGE_CONTAINER([
|
|
90
|
-
CTA_LINK(`Upgrade Plan`, 'https://www.dreamhost.com/remixer-website-builder/', true)
|
|
91
|
-
|
|
92
|
-
].join('\n')),
|
|
93
|
-
NAVBAR: BADGE_CONTAINER([
|
|
94
|
-
CTA_LINK(`Upgrade plan`, 'https://www.dreamhost.com/remixer-website-builder/'),
|
|
95
|
-
CTA_LINK(`Get Access`, 'https://www.dreamhost.com/remixer-website-builder/'),
|
|
96
|
-
CTA_LINK(`Signup`, 'https://www.dreamhost.com/remixer-website-builder/')
|
|
97
|
-
].join('\n')),
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
const BADGE_CONTENT = DICTIONARY[REMIXER_BADGE_TYPE]
|
|
101
|
-
|
|
102
|
-
return html.replace(/<\/body>/, `${BADGE_CONTENT}\n</body>`);
|
|
103
|
-
} catch (e) {
|
|
104
|
-
console.warn('Remixer badge failed to inject', e);
|
|
105
|
-
return html;
|
|
106
|
-
}
|
|
107
|
-
},
|
|
108
|
-
};
|
|
109
|
-
}
|
|
110
|
-
|
|
111
8
|
// Switches from Tailwind CDN to regular Tailwind CSS with PostCSS for production builds
|
|
112
9
|
function tailwindProdPlugin(): Plugin {
|
|
113
10
|
return {
|
|
@@ -137,7 +34,7 @@ function tailwindProdPlugin(): Plugin {
|
|
|
137
34
|
|
|
138
35
|
transformIndexHtml(html) {
|
|
139
36
|
return html.replace(
|
|
140
|
-
/\s*<script\s+src=["']https:\/\/cdn\.tailwindcss\.com[
|
|
37
|
+
/\s*<script\s+src=["']https:\/\/cdn\.tailwindcss\.com["']\s*><\/script>\s*/g,
|
|
141
38
|
"\n"
|
|
142
39
|
);
|
|
143
40
|
},
|
|
@@ -159,10 +56,16 @@ const VIRTUAL_OO_ID = "virtual:openobserve";
|
|
|
159
56
|
const RESOLVED_OO_ID = "\0" + VIRTUAL_OO_ID;
|
|
160
57
|
|
|
161
58
|
function openobservePlugin(): Plugin {
|
|
59
|
+
let env: Record<string, string> = {};
|
|
60
|
+
|
|
162
61
|
return {
|
|
163
62
|
name: "vite-plugin-openobserve",
|
|
164
63
|
apply: "build",
|
|
165
64
|
|
|
65
|
+
config(_, { mode }) {
|
|
66
|
+
env = loadEnv(mode, process.cwd(), "VITE_OO_");
|
|
67
|
+
},
|
|
68
|
+
|
|
166
69
|
resolveId(id) {
|
|
167
70
|
if (id === VIRTUAL_OO_ID) return RESOLVED_OO_ID;
|
|
168
71
|
},
|
|
@@ -170,55 +73,47 @@ function openobservePlugin(): Plugin {
|
|
|
170
73
|
load(id) {
|
|
171
74
|
if (id !== RESOLVED_OO_ID) return;
|
|
172
75
|
|
|
173
|
-
const token =
|
|
76
|
+
const token = env.VITE_OO_CLIENT_TOKEN;
|
|
174
77
|
if (!token) return "export default false;";
|
|
175
78
|
|
|
176
|
-
const
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
const
|
|
180
|
-
const
|
|
181
|
-
const appId = process.env.VITE_OO_APP_ID || "";
|
|
182
|
-
const service = domain;
|
|
183
|
-
const version = process.env.VITE_OO_VERSION || "0.0.0";
|
|
184
|
-
const env = process.env.NEXT_PUBLIC_ENVIRONMENT || "production";
|
|
79
|
+
const site = env.VITE_OO_SITE || "api.openobserve.ai";
|
|
80
|
+
const org = env.VITE_OO_ORG || "";
|
|
81
|
+
const appId = env.VITE_OO_APP_ID || "";
|
|
82
|
+
const service = env.VITE_OO_SERVICE || "";
|
|
83
|
+
const version = env.VITE_OO_VERSION || "0.0.1";
|
|
185
84
|
|
|
186
85
|
return `
|
|
187
86
|
import { openobserveRum } from "@openobserve/browser-rum-slim";
|
|
188
87
|
import { openobserveLogs } from "@openobserve/browser-logs";
|
|
189
88
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
});
|
|
219
|
-
} catch (e) {
|
|
220
|
-
console.warn('RemixerObserve failed to initialize', e);
|
|
221
|
-
}
|
|
89
|
+
openobserveRum.init({
|
|
90
|
+
applicationId: ${JSON.stringify(appId)},
|
|
91
|
+
clientToken: ${JSON.stringify(token)},
|
|
92
|
+
site: ${JSON.stringify(site)},
|
|
93
|
+
organizationIdentifier: ${JSON.stringify(org)},
|
|
94
|
+
service: ${JSON.stringify(service)},
|
|
95
|
+
env: "production",
|
|
96
|
+
version: ${JSON.stringify(version)},
|
|
97
|
+
trackResources: true,
|
|
98
|
+
trackLongTasks: true,
|
|
99
|
+
trackUserInteractions: true,
|
|
100
|
+
insecureHTTP: false,
|
|
101
|
+
apiVersion: "v1",
|
|
102
|
+
defaultPrivacyLevel: "allow",
|
|
103
|
+
sessionSampleRate: 100,
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
openobserveLogs.init({
|
|
107
|
+
clientToken: ${JSON.stringify(token)},
|
|
108
|
+
site: ${JSON.stringify(site)},
|
|
109
|
+
organizationIdentifier: ${JSON.stringify(org)},
|
|
110
|
+
service: ${JSON.stringify(service)},
|
|
111
|
+
env: "production",
|
|
112
|
+
version: ${JSON.stringify(version)},
|
|
113
|
+
forwardErrorsToLogs: true,
|
|
114
|
+
insecureHTTP: false,
|
|
115
|
+
apiVersion: "v1",
|
|
116
|
+
});
|
|
222
117
|
|
|
223
118
|
export default true;
|
|
224
119
|
`;
|
|
@@ -234,7 +129,6 @@ export default true;
|
|
|
234
129
|
|
|
235
130
|
export default defineConfig({
|
|
236
131
|
plugins: [
|
|
237
|
-
injectRemixerBadgePlugin(),
|
|
238
132
|
openobservePlugin(),
|
|
239
133
|
tailwindProdPlugin(),
|
|
240
134
|
react(),
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
import { createClient } from '@supabase/supabase-js';
|
|
3
|
+
import type { Session } from '@supabase/supabase-js';
|
|
3
4
|
|
|
4
5
|
/**
|
|
5
6
|
* 1) supabase — user-scoped client
|
|
@@ -35,6 +36,25 @@ export const supabaseProject = createClient(
|
|
|
35
36
|
}
|
|
36
37
|
);
|
|
37
38
|
|
|
39
|
+
export function isValidProjectSession(session: Session | null) {
|
|
40
|
+
if (!session) return true;
|
|
41
|
+
const sessionProjectId = session?.user?.app_metadata?.project_id;
|
|
42
|
+
return sessionProjectId === import.meta.env.VITE_PROJECT_ID;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
export async function getProjectSession() {
|
|
46
|
+
const {
|
|
47
|
+
data: { session },
|
|
48
|
+
} = await supabase.auth.getSession();
|
|
49
|
+
|
|
50
|
+
if (!isValidProjectSession(session)) {
|
|
51
|
+
await supabase.auth.signOut({ scope: 'local' });
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
return session;
|
|
56
|
+
}
|
|
57
|
+
|
|
38
58
|
/**
|
|
39
59
|
* authHeader() — helper for manual fetch() calls (Edge Functions/REST)
|
|
40
60
|
* • Returns `{ Authorization: 'Bearer <token>' }` where `<token>` is:
|
|
@@ -45,16 +65,7 @@ export const supabaseProject = createClient(
|
|
|
45
65
|
* time — no client-side updateUser() needed.
|
|
46
66
|
*/
|
|
47
67
|
export async function authHeader() {
|
|
48
|
-
const
|
|
49
|
-
data: { session },
|
|
50
|
-
} = await supabase.auth.getSession();
|
|
51
|
-
|
|
52
|
-
if (session?.user?.app_metadata?.project_id &&
|
|
53
|
-
session.user.app_metadata.project_id !== import.meta.env.VITE_PROJECT_ID) {
|
|
54
|
-
await supabase.auth.signOut({ scope: 'local' });
|
|
55
|
-
return { Authorization: `Bearer ${import.meta.env.VITE_PROJECT_ACCESS_TOKEN}` };
|
|
56
|
-
}
|
|
57
|
-
|
|
68
|
+
const session = await getProjectSession();
|
|
58
69
|
const token =
|
|
59
70
|
session?.access_token ?? import.meta.env.VITE_PROJECT_ACCESS_TOKEN;
|
|
60
71
|
|