.env.development

@@ -1,4 +1,5 @@
 VITE_PLATFORM=WEB
+VITE_UI_URL=${DEV_UI_URL}
 VITE_API_URL=${DEV_API_URL}
 VITE_API_TOKEN_URL=${VITE_API_URL}/token
 VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY}

.env.production

@@ -1,4 +1,5 @@
 VITE_PLATFORM=WEB
+VITE_UI_URL=${PRODUCT_UI_URL}
 VITE_API_URL=${PRODUCT_API_URL}
 VITE_API_TOKEN_URL=${VITE_API_URL}/token
 VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY}

.env.testing

@@ -1,5 +1,6 @@
 NODE_ENV=development
 VITE_PLATFORM=WEB
+VITE_UI_URL=${TEST_UI_URL}
 VITE_API_URL=${TEST_API_URL}
 VITE_API_TOKEN_URL=${VITE_API_URL}/token
 VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY}

src/assets/css/pages/user/index.scss

@@ -70,6 +70,8 @@
         }
 
         .url {
+          cursor: pointer;
+
           > span {
             margin-left: 8px;
           }

src/components/Playground/Output/Preview/iframe.html

@@ -11,7 +11,7 @@
   window.addEventListener("message", ({ data }) => {
     if (data?.type === "UPDATE") {
       // Record old styles that need to be removed
-      const appStyleElement = document.querySelectorAll("style[id^=\"style_\"]") || [];
+      const appStyleElement = document.querySelectorAll("style:not(style[id$=\"_oxygen_base_style.css\"])") || [];
 
       // Remove old app
       const appSrcElement = document.querySelector("#appSrc");

src/global.d.ts

@@ -5,6 +5,7 @@ type Platform = 'WEB' | 'DESKTOP' | 'ANDROID'
 
 interface ImportMetaEnv {
     readonly VITE_PLATFORM: Platform
+    readonly VITE_UI_URL: string
     readonly VITE_API_URL: string
     readonly VITE_API_TOKEN_URL: string
     readonly VITE_TURNSTILE_SITE_KEY: string

src/pages/System/Tools/Base.tsx

@@ -637,8 +637,10 @@ const Base = () => {
                             rules={[
                                 { required: true },
                                 {
-                                    pattern: /\.(jsx|tsx|js|ts|css|json)$/,
+                                    pattern:
-                                    message: '仅支持 *.jsx, *.tsx, *.js, *.ts, *.css, *.json 文件'
+                                        /(\.jsx|\.tsx|\.js|\.ts|_oxygen_base_style\.css|\.json)$/,
+                                    message:
+                                        '仅支持 *.jsx, *.tsx, *.js, *.ts, *_oxygen_base_style.css, *.json 文件'
                                 },
                                 ({ getFieldValue }) => ({
                                     validator() {
@@ -829,9 +831,10 @@ const Base = () => {
                                 rules={[
                                     { required: true },
                                     {
-                                        pattern: /\.(jsx|tsx|js|ts|css|json)$/,
+                                        pattern:
+                                            /(\.jsx|\.tsx|\.js|\.ts|_oxygen_base_style\.css|\.json)$/,
                                         message:
-                                            '仅支持 *.jsx, *.tsx, *.js, *.ts, *.css, *.json 文件'
+                                            '仅支持 *.jsx, *.tsx, *.js, *.ts, *_oxygen_base_style.css, *.json 文件'
                                     },
                                     ({ getFieldValue }) => ({
                                         validator() {

src/pages/Tools/User.tsx

@@ -30,7 +30,7 @@ const User = () => {
         return username
             ? () => {
                   void navigator.clipboard
-                      .writeText(new URL(`/store/${username}`, location.href).href)
+                      .writeText(new URL(`/store/${username}`, import.meta.env.VITE_UI_URL).href)
                       .then(() => {
                           void message.success('已复制到剪切板')
                       })
@@ -153,8 +153,10 @@ const User = () => {
                                     onClick={handleOnCopyToClipboard(userWithInfoVo?.username)}
                                 >
                                     {userWithInfoVo?.username &&
-                                        new URL(`/store/${userWithInfoVo.username}`, location.href)
+                                        new URL(
-                                            .href}
+                                            `/store/${userWithInfoVo.username}`,
+                                            import.meta.env.VITE_UI_URL
+                                        ).href}
                                     <Icon component={IconOxygenCopy} />
                                 </a>
                             </FlexBox>

src/pages/User/index.tsx

@@ -39,6 +39,18 @@ const User = () => {
     const [userWithPowerInfoVo, setUserWithPowerInfoVo] = useState<UserWithPowerInfoVo>()
     const [changePasswordForm] = AntdForm.useForm<ChangePasswordFields>()
 
+    const handleOnCopyToClipboard = (username?: string) => {
+        return username
+            ? () => {
+                  void navigator.clipboard
+                      .writeText(new URL(`/store/${username}`, import.meta.env.VITE_UI_URL).href)
+                      .then(() => {
+                          void message.success('已复制到剪切板')
+                      })
+              }
+            : undefined
+    }
+
     const handleOnReset = () => {
         getProfile()
     }
@@ -474,20 +486,14 @@ const User = () => {
                                 </div>
                                 <a
                                     className={'url'}
-                                    href={
+                                    onClick={handleOnCopyToClipboard(userWithPowerInfoVo?.username)}
-                                        userWithPowerInfoVo?.username &&
-                                        new URL(
-                                            `/store/${userWithPowerInfoVo.username}`,
-                                            location.href
-                                        ).href
-                                    }
                                 >
                                     {userWithPowerInfoVo?.username &&
                                         new URL(
                                             `/store/${userWithPowerInfoVo.username}`,
-                                            location.href
+                                            import.meta.env.VITE_UI_URL
                                         ).href}
-                                    <Icon component={IconOxygenShare} />
+                                    <Icon component={IconOxygenCopy} />
                                 </a>
                             </FlexBox>
                         </FlexBox>

src/util/navigation.ts

@@ -37,15 +37,15 @@ export const navigateToView = (
     version?: string,
     options?: NavigateOptions
 ) => {
-    const url = new URL(
+    const searchParams = new URLSearchParams()
-        `/view/${username}/${toolId}${version ? `/${version}` : ''}`,
-        window.location.href
-    )
     if (platform !== import.meta.env.VITE_PLATFORM) {
-        url.searchParams.append('platform', platform)
+        searchParams.append('platform', platform)
     }
 
-    navigate(`${url.pathname}${url.search}`, options)
+    navigate(
+        `/view/${username}/${toolId}${version ? `/${version}` : ''}${searchParams.size ? `?${searchParams.toString()}` : ''}`,
+        options
+    )
 }
 
 export const navigateToSource = (
@@ -56,14 +56,15 @@ export const navigateToSource = (
     version?: string,
     options?: NavigateOptions
 ) => {
-    const url = new URL(
+    const searchParams = new URLSearchParams()
-        `/source/${username}/${toolId}${version ? `/${version}` : ''}`,
-        window.location.href
-    )
     if (platform !== import.meta.env.VITE_PLATFORM) {
-        url.searchParams.append('platform', platform)
+        searchParams.append('platform', platform)
     }
-    navigate(`${url.pathname}${url.search}`, options)
+
+    navigate(
+        `/source/${username}/${toolId}${version ? `/${version}` : ''}${searchParams.size ? `?${searchParams.toString()}` : ''}`,
+        options
+    )
 }
 
 export const navigateToRedirect = (
@@ -113,12 +114,12 @@ export const navigateToEdit = (
     platform: Platform,
     options?: NavigateOptions
 ) => {
-    const url = new URL(`/edit/${toolId}`, window.location.href)
+    const searchParams = new URLSearchParams()
     if (platform !== import.meta.env.VITE_PLATFORM) {
-        url.searchParams.append('platform', platform)
+        searchParams.append('platform', platform)
     }
 
-    navigate(`${url.pathname}${url.search}`, options)
+    navigate(`/edit/${toolId}${searchParams.size ? `?${searchParams.toString()}` : ''}`, options)
 }
 
 export const navigateToUser = (navigate: NavigateFunction, options?: NavigateOptions) => {
@@ -135,15 +136,12 @@ export const getViewPath = (
     platform: Platform,
     version?: string
 ) => {
-    const url = new URL(
+    const searchParams = new URLSearchParams()
-        `/view/${username}/${toolId}${version ? `/${version}` : ''}`,
-        window.location.href
-    )
     if (platform !== import.meta.env.VITE_PLATFORM) {
-        url.searchParams.append('platform', platform)
+        searchParams.append('platform', platform)
     }
 
-    return `${url.pathname}${url.search}`
+    return `/view/${username}/${toolId}${version ? `/${version}` : ''}${searchParams.size ? `?${searchParams.toString()}` : ''}`
 }
 
 export const getAndroidUrl = (username: string, toolId: string) =>