增加检测vocespace环境部署状态，修改部分翻译 (#280)

translation: Vocespace -> VoceSpace
- Download shell to deploy vocespace
- check vocespace state

public/locales/de/setting.json

@@ -26,8 +26,8 @@
     "video": "Videoanrufe"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Selbstgehosteter Vocespace (Automatisierte Bereitstellung)",
+    "desc": "Selbstgehosteter VoceSpace (Automatisierte Bereitstellung)",
     "prerequisite": [
       "Voraussetzungen",
       "Docker-Umgebung",
@@ -35,7 +35,7 @@
       "Die Domain ist registriert",
       "Für Unternehmensanpassungen oder bei Fragen wenden Sie sich bitte an han@privoce.com oder fügen Sie uns auf WeChat hinzu: Privoce"
     ],
-    "sub_desc": "Jedes Vocespace-Konto bietet unbegrenzte Gesprächsminuten, 5 gleichzeitige Teilnehmer und eine kostenlose 4K-Auflösung. Es ist keine Kontoerstellung erforderlich. Befolgen Sie die unten stehenden Anweisungen, um Ihren Vocespace korrekt zu konfigurieren.",
+    "sub_desc": "Jedes VoceSpace-Konto bietet unbegrenzte Gesprächsminuten, 5 gleichzeitige Teilnehmer und eine kostenlose 4K-Auflösung. Es ist keine Kontoerstellung erforderlich. Befolgen Sie die unten stehenden Anweisungen, um Ihren VoceSpace korrekt zu konfigurieren.",
     "domain_desc": "Diese Domain benötigt einen DNS-A-Eintrag, der auf die IP-Adresse des aktuellen Servers verweist, auf dem Sie VoceChat hosten.",
     "enable": "Aktivieren",
     "how_to": "Nach der Aktivierung legen Sie bitte eine benutzerdefinierte Domain fest. Klicken Sie auf „Speichern“, und das System aktiviert VoceSpace automatisch."

public/locales/en/setting.json

@@ -270,8 +270,8 @@
     "how_to": "How to setup Agora?"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Use self-hosted Vocespace (Automated Deployment)",
+    "desc": "Use self-hosted VoceSpace (Automated Deployment)",
     "prerequisite": [
       "Prerequisites",
       "Docker environment",
@@ -279,7 +279,7 @@
       "The domain has been registered",
       "For enterprises customization or need help, please contact han@privoce.com or add WeChat: Privoce"
     ],
-    "sub_desc": "Each Vocespace account will enjoy no limit minutes, 5 person concurrent and 4k resolution for free. No account creation required. Follow the instruction below to configure your Vocespace correctly.",
+    "sub_desc": "Each VoceSpace account will enjoy no limit minutes, 5 person concurrent and 4k resolution for free. No account creation required. Follow the instruction below to configure your VoceSpace correctly.",
     "domain_desc": "This domain needs to have a DNS A record pointing to the current server IP you are hosting VoceChat.",
     "enable": "Enable",
     "how_to": "After enabling, please set a custom domain then click save, and the system will automatically enable VoceSpace."

public/locales/es/setting.json

@@ -26,9 +26,9 @@
     "video": "Video"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace implementado de forma privada (implementación automática)",
+    "desc": "VoceSpace implementado de forma privada (implementación automática)",
-    "sub_desc": "Cada cuenta de Vocespace disfrutará de llamadas ilimitadas gratuitas, 5 usuarios simultáneos y resolución 4K. No es necesario crear una cuenta. Siga las instrucciones a continuación para configurar correctamente su Vocespace.",
+    "sub_desc": "Cada cuenta de VoceSpace disfrutará de llamadas ilimitadas gratuitas, 5 usuarios simultáneos y resolución 4K. No es necesario crear una cuenta. Siga las instrucciones a continuación para configurar correctamente su VoceSpace.",
     "prerequisite": [
       "Prerrequisitos",
       "Entorno Docker",

public/locales/fr/setting.json

@@ -26,9 +26,9 @@
     "video": "Vidéo"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace déployé en mode privé (déploiement automatique)",
+    "desc": "VoceSpace déployé en mode privé (déploiement automatique)",
-    "sub_desc": "Chaque compte Vocespace bénéficie d'appels illimités gratuits, de 5 utilisateurs simultanés et d'une résolution 4K. Aucune création de compte n'est requise. Suivez les instructions ci-dessous pour configurer correctement votre Vocespace.",
+    "sub_desc": "Chaque compte VoceSpace bénéficie d'appels illimités gratuits, de 5 utilisateurs simultanés et d'une résolution 4K. Aucune création de compte n'est requise. Suivez les instructions ci-dessous pour configurer correctement votre VoceSpace.",
     "prerequisite": [
       "Prérequis",
       "Environnement Docker",

public/locales/jp/setting.json

@@ -22,9 +22,9 @@
     "video": "ビデオ"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace をプライベートに導入（自動導入）",
+    "desc": "VoceSpace をプライベートに導入（自動導入）",
-    "sub_desc": "Vocespace アカウントごとに、通話時間無制限、同時接続ユーザー5名、4K解像度のサービスを無料でご利用いただけます。アカウント作成は不要です。Vocespace を適切に設定するには、以下の手順に従ってください。",
+    "sub_desc": "VoceSpace アカウントごとに、通話時間無制限、同時接続ユーザー5名、4K解像度のサービスを無料でご利用いただけます。アカウント作成は不要です。VoceSpace を適切に設定するには、以下の手順に従ってください。",
     "prerequisite": [
       "前提条件",
       "Docker 環境",

public/locales/pt/setting.json

@@ -26,9 +26,9 @@
     "video": "Video"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace déployé en mode privé (déploiement automatique)",
+    "desc": "VoceSpace déployé en mode privé (déploiement automatique)",
-    "sub_desc": "Chaque compte Vocespace bénéficie d'appels illimités gratuits, de 5 utilisateurs simultanés et d'une résolution 4K. Aucune création de compte n'est requise. Suivez les instructions ci-dessous pour configurer correctement votre Vocespace.",
+    "sub_desc": "Chaque compte VoceSpace bénéficie d'appels illimités gratuits, de 5 utilisateurs simultanés et d'une résolution 4K. Aucune création de compte n'est requise. Suivez les instructions ci-dessous pour configurer correctement votre VoceSpace.",
     "prerequisite": [
       "Prérequis",
       "Environnement Docker",

public/locales/ru/setting.json

@@ -26,9 +26,9 @@
     "video": "Видео"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace развернут в частном порядке (автоматическое развертывание)",
+    "desc": "VoceSpace развернут в частном порядке (автоматическое развертывание)",
-    "sub_desc": "Каждая учетная запись Vocespace будет пользоваться бесплатным неограниченным временем звонков, 5 одновременными пользователями и разрешением 4K. Создание учетной записи не требуется. Следуйте приведенным ниже инструкциям для правильной настройки Vocespace.",
+    "sub_desc": "Каждая учетная запись VoceSpace будет пользоваться бесплатным неограниченным временем звонков, 5 одновременными пользователями и разрешением 4K. Создание учетной записи не требуется. Следуйте приведенным ниже инструкциям для правильной настройки VoceSpace.",
     "prerequisite": [
       "Предварительные условия",
       "Среда Docker",

public/locales/tr/setting.json

@@ -27,9 +27,9 @@
     "video": "Video"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "Vocespace özel olarak dağıtıldı (otomatik dağıtım)",
+    "desc": "VoceSpace özel olarak dağıtıldı (otomatik dağıtım)",
-    "sub_desc": "Her Vocespace hesabı ücretsiz sınırsız arama süresi, 5 eş zamanlı kullanıcı ve 4K çözünürlük hizmetinden yararlanacaktır. Hesap oluşturma gerekmez. Vocespace'inizi doğru şekilde yapılandırmak için aşağıdaki talimatları izleyin.",
+    "sub_desc": "Her VoceSpace hesabı ücretsiz sınırsız arama süresi, 5 eş zamanlı kullanıcı ve 4K çözünürlük hizmetinden yararlanacaktır. Hesap oluşturma gerekmez. VoceSpace'inizi doğru şekilde yapılandırmak için aşağıdaki talimatları izleyin.",
     "prerequisite": [
       "Önkoşullar",
       "Docker ortamı",

public/locales/zh/setting.json

@@ -269,9 +269,9 @@
     "how_to": "如何配置 Agora？"
   },
   "vocespace": {
-    "title": "Vocespace",
+    "title": "VoceSpace",
-    "desc": "使用私有部署的Vocespace(自动部署)",
+    "desc": "使用私有部署的VoceSpace(自动部署)",
-    "sub_desc": "每个Vocespace账户将享受免费无限制通话时长、5人并发及4K分辨率服务。无需创建账户。按照以下说明正确配置您的Vocespace。",
+    "sub_desc": "每个VoceSpace账户将享受免费无限制通话时长、5人并发及4K分辨率服务。无需创建账户。按照以下说明正确配置您的VoceSpace。",
     "prerequisite": [
       "预备条件",
       "Docker环境",

src/components/BlankPlaceholder.tsx

@@ -54,7 +54,6 @@ const BlankPlaceholder: FC<Props> = ({ type = "chat" }) => {
     navigate("/setting/license");
   };
   const currentVersion = useAppSelector((store) => store.server.version, shallowEqual);
-  console.warn("currentVersion", currentVersion, compareVersion(currentVersion, "0.5.6"));
   const showVoceSpace = useMemo(
     () => compareVersion(currentVersion, "0.5.6") >= 0,
     [currentVersion]

src/routes/chat/VoiceChat/index.tsx

@@ -104,7 +104,13 @@ const VoiceChat = ({ id, context = "channel" }: Props) => {
 
   const handleSendVocespaceRequest = async () => {
     if (vocespaceConfig && vocespaceConfig.state && vocespaceConfig.state === "undeployed") {
-      await sendVoceSpaceMsg(`https://vocespace.com/${context}_${id}`);
+      const genUUID = () =>
+        "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (c) =>
+          (+c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (+c / 4)))).toString(16)
+        );
+      await sendVoceSpaceMsg(
+        `https://vocespace.com/${context}_${id}_${encodeURIComponent(genUUID())}`
+      );
     } else if (vocespaceConfig && vocespaceConfig?.enabled && vocespaceConfig.state === "success") {
       let url = vocespaceConfig.url;
       if (url.includes(":7880")) {

src/routes/setting/config/Agora.tsx

@@ -72,7 +72,7 @@ export default function ConfigAgora() {
           style={{ width: "fit-content" }}
         >
           <li className={getClass(!isAgora)} data-view={"item"} onClick={() => setIsAgora(false)}>
-            <Label>Vocespace</Label>
+            <Label>VoceSpace</Label>
           </li>
           <li className={getClass(isAgora)} data-view={"grid"} onClick={() => setIsAgora(true)}>
             <Label>Agora</Label>

src/routes/setting/config/Vocespace.tsx

@@ -8,23 +8,11 @@ import SaveTip from "@/components/SaveTip";
 import useConfig from "@/hooks/useConfig";
 import { VocespaceConfig } from "@/types/server";
 import { ChangeEvent, useEffect, useRef, useState } from "react";
-import { isNull } from "lodash";
 
 export function ConfigVocespace() {
   const { t } = useTranslation("setting", { keyPrefix: "vocespace" });
-  const [fetchData, setFetchData] = useState<VocespaceConfig | null>(null);
-  useEffect(() => {
-    if (!isNull(fetchData?.state) && fetchData?.state !== "in_progress") {
-      // 停止轮询
-      if (interval.current) {
-        clearInterval(interval.current);
-      }
-    }
-  }, [fetchData]);
   const { changed, reset, values, setValues, toggleEnable, updateConfig, refetch } =
     useConfig("vocespace");
-  // 定时器，用来每隔2分钟获取一次最新的配置状态，只要发现有state字段就能知道自动化部署是否成功，没有则继续轮询
-  const interval = useRef<NodeJS.Timeout | null>(null);
 
   const handleUpdate = async () => {
     const _values = values as VocespaceConfig;
@@ -34,22 +22,24 @@ export function ConfigVocespace() {
     }
 
     // 后端快速返回结果，只要检测环境可以执行就立即返回成功，不然会一直pending等待，导致前端超时
-    const { error } = await updateConfig(_values);
+    const res = await updateConfig(_values);
-    if (error) {
+
-      alert(`Auto Deploy Failed: ${error}`);
+    if (res.error) {
+      alert(`Auto Deploy Failed: ${res.error}`);
     } else {
-      // 创建一个轮询定时器，每隔2分钟获取一次最新的配置状态
+      let { data } = res;
-      if (interval.current) {
+
-        clearInterval(interval.current);
+      if ((data as unknown as string) === "deployed") {
+        return;
+      } else {
+        // 生成 sh文件让用户下载
+        const el = document.createElement("a");
+        const file = new Blob([data as unknown as string], { type: "text/plain" });
+        el.href = URL.createObjectURL(file);
+        el.download = "deploy_vocespace.sh";
+        document.body.appendChild(el); // Required for this to work in FireFox
+        el.click();
       }
-      // 先fetch一次，避免等待2分钟的空档期
-      const { data } = await refetch();
-      setFetchData(data as VocespaceConfig);
-      interval.current = setInterval(async () => {
-        console.warn("Fetching Vocespace Config for deployment status...");
-        const { data } = await refetch();
-        setFetchData(data as VocespaceConfig);
-      }, 2 * 60 * 1000);
     }
   };
 
@@ -135,35 +125,30 @@ export function ConfigVocespace() {
         </div>
       </div>
       <div>
-        {state ? (
+        {state && (
           <div style={{ fontSize: 12 }}>
-            {state === "success" && (
+            {state === "success" ? (
               <StateDot
-                color="green"
+                color="#00ff00"
                 className="text-green-400"
-                word="Vocespace deployed successfully."
+                word="VoceSpace deployed successfully."
-              />
-            )}
-            {state === "in_progress" && (
-              <StateDot
-                color="yellow"
-                className="text-yellow-400"
-                word="Vocespace deployment in progress..."
-              />
-            )}
-            {state === "failed" && (
-              <StateDot color="red" className="text-red-400" word="Vocespace deployment failed." />
-            )}
-            {state === "undeployed" && (
-              <StateDot
-                color="gray"
-                className="text-gray-400"
-                word="Vocespace is not deployed yet."
               />
+            ) : (
+              <>
+                <StateDot
+                  color="gray"
+                  className="text-gray-400"
+                  word="VoceSpace is not deployed yet or failed."
+                />
+                {enabled && (
+                  <span className="text-red-500">
+                    please run the deploy_vocespace.sh in your vps or server <br></br>{" "}
+                    <pre>chmod +x deploy_vocespace.sh && sh ./deploy_vocespace.sh</pre>
+                  </span>
+                )}
+              </>
             )}
           </div>
-        ) : (
-          <StateDot color="gray" className="text-gray-400" word="Vocespace is not deployed yet." />
         )}
         <div
           className="list-disc list-inside text-sm text-gray-400 mb-4"