fix(web): fix storage path concatenation & add dependency install tip (#1864)

* fix(web): fix storage path concatenation & add dependency install tip

* change tip content

* change en tip

* Update translation.json

---------

Co-authored-by: 0fatal <72899968+0fatal@users.noreply.github.com>

web/public/locales/en/translation.json

@@ -139,7 +139,8 @@
     "DeployChangelog": "Input the description of this function modification (optional)",
     "MoveFunctionTip": "Are you sure to move {{srcFunc}} to {{targetDir}} directory?",
     "MoveFunctionToRootTip": "Are you sure to move {{srcFunc}} to the root directory?",
-    "MovingFunction": "Moving functions..."
+    "MovingFunction": "Moving functions...",
+    "DependenceInstallTip": "Please wait for the completion of dependencies installation after saving. Check the progress in \"Logs\""
   },
   "HomePanel": {
     "APP": "Android or iOS app",

web/public/locales/zh-CN/translation.json

@@ -139,7 +139,8 @@
     "DeployChangelog": "输入此次函数修改的描述 (可选)",
     "MoveFunctionTip": "是否要将 {{srcFunc}} 移动到 {{targetDir}} 目录？",
     "MoveFunctionToRootTip": "是否要将 {{srcFunc}} 移动到根目录？",
-    "MovingFunction": "移动函数中..."
+    "MovingFunction": "移动函数中...",
+    "DependenceInstallTip": "保存后请等待依赖安装完成，在「日志」查看安装进度"
   },
   "HomePanel": {
     "APP": "Android or iOS 应用",

web/public/locales/zh/translation.json

@@ -139,7 +139,8 @@
     "DeployChangelog": "输入此次函数修改的描述 (可选)",
     "MoveFunctionTip": "是否要将 {{srcFunc}} 移动到 {{targetDir}} 目录？",
     "MoveFunctionToRootTip": "是否要将 {{srcFunc}} 移动到根目录？",
-    "MovingFunction": "移动函数中..."
+    "MovingFunction": "移动函数中...",
+    "DependenceInstallTip": "保存后请等待依赖安装完成，在「日志」查看安装进度"
   },
   "HomePanel": {
     "APP": "Android or iOS 应用",

web/src/pages/app/functions/mods/DependencePanel/AddDependenceModal/index.tsx

@@ -1,11 +1,12 @@
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { AddIcon, ExternalLinkIcon, SearchIcon, SmallCloseIcon } from "@chakra-ui/icons";
+import { AddIcon, ExternalLinkIcon, InfoOutlineIcon, SearchIcon, SmallCloseIcon } from "@chakra-ui/icons";
 import {
   Box,
   Button,
   Center,
   Checkbox,
+  HStack,
   Input,
   InputGroup,
   InputLeftElement,
@@ -335,37 +336,45 @@ const AddDependenceModal = () => {
             )}
           </ModalBody>
 
-          <ModalFooter>
-            {checkList.length > 0 && (
-              <span
-                className="mr-2 text-lg hover:cursor-pointer "
+          <ModalFooter justifyContent={'space-between'}>
+            <HStack>
+              <span className="flex items-center text-grayModern-600">
+                <InfoOutlineIcon className="mx-1" />
+                {t("FunctionPanel.DependenceInstallTip")}
+              </span>
+            </HStack>
+            <HStack>
+              {checkList.length > 0 && (
+                <span
+                  className="mr-2 text-lg hover:cursor-pointer "
+                  onClick={() => {
+                    if (!isEdit) {
+                      setIsShowChecked((pre) => !pre);
+                    }
+                  }}
+                >
+                  {t("FunctionPanel.Select")}:
+                  <span className="mx-2 text-blue-500 ">
+                    {isEdit ? (
+                      packageList.length
+                    ) : isShowChecked ? (
+                      <SmallCloseIcon fontSize={16} className="align-middle" />
+                    ) : (
+                      checkList.length
+                    )}
+                  </span>
+                </span>
+              )}
+
+              <Button
+                isLoading={editPackageMutation.isLoading || addPackageMutation.isLoading}
                 onClick={() => {
-                  if (!isEdit) {
-                    setIsShowChecked((pre) => !pre);
-                  }
+                  submitDependence();
                 }}
               >
-                {t("FunctionPanel.Select")}:
-                <span className="mx-2 text-blue-500 ">
-                  {isEdit ? (
-                    packageList.length
-                  ) : isShowChecked ? (
-                    <SmallCloseIcon fontSize={16} className="align-middle" />
-                  ) : (
-                    checkList.length
-                  )}
-                </span>
-              </span>
-            )}
-
-            <Button
-              isLoading={editPackageMutation.isLoading || addPackageMutation.isLoading}
-              onClick={() => {
-                submitDependence();
-              }}
-            >
-              {t("Save")}
-            </Button>
+                {t("Save")}
+              </Button>
+            </HStack>
           </ModalFooter>
         </ModalContent>
       </Modal>

web/src/pages/app/storages/store.ts

@@ -65,7 +65,7 @@ const useStorageStore = create<State>()(
 
       getFilePath: (bucket: string, file: string) => {
         const currentApp = useGlobalStore.getState().currentApp;
-        return `${currentApp.storage.endpoint}/${bucket}${formatPort(currentApp?.port)}/${file}`;
+        return `${currentApp.storage.endpoint}/${bucket}/${file}`;
       },
     })),
   ),