chore: updates

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vocechat-web",
-  "version": "0.7.23",
+  "version": "0.7.24",
   "homepage": "https://voce.chat",
   "dependencies": {
     "@metamask/onboarding": "^1.0.1",

src/app/config.ts

@@ -13,7 +13,7 @@ const prices: Price[] = [
 ];
 const official_dev = `https://dev.voce.chat`;
 const local_dev = `https://dev.voce.chat`;
-// const local_dev = `https://cqvoce.com`;
+// const local_dev = `http://localhost:3881`;
 const dev_origin = process.env.REACT_APP_OFFICIAL_DEMO ? official_dev : local_dev;
 
 // const local_dev = `https://im.ttt.td`;
@@ -75,6 +75,7 @@ export const PAYMENT_URL_PREFIX =
     ? `https://vera.nicegoodthings.com`
     : `http://localhost:4000`;
 export const CACHE_VERSION = `0.3.37`;
+export const WIDGET_USER_PWD = `123123`;
 export const GuestRoutes = ["/", "/chat", "/chat/channel/:channel_id"];
 export const ContentTypes = {
   text: "text/plain",

src/components/FileMessage/AudioMessage.tsx

@@ -5,6 +5,7 @@ import IconDownload from "@/assets/icons/download.svg";
 import IconAudio from "@/assets/icons/file.audio.svg";
 import { formatBytes } from "../../utils";
 import ExpiredMessage from "./ExpiredMessage";
+import DownloadArea from "./DownloadArea";
 
 type Props = {
   url: string;
@@ -40,9 +41,7 @@ const AudioMessage = ({ url, name, size, download }: Props) => {
             <span className="text-gray-400">{_size}</span>
           </div>
         </div>
-        <a href={download} className="mt-2 hidden md:block">
+        <DownloadArea copyLink={download} downloadLink={download} />
-          <IconDownload className="fill-gray-500 dark:fill-gray-400" />
-        </a>
       </div>
       <audio
         onError={handleError}

src/components/FileMessage/DownloadArea.tsx

@@ -0,0 +1,28 @@
+import useCopy from "@/hooks/useCopy";
+import IconDownload from "@/assets/icons/download.svg";
+import IconCopy from "@/assets/icons/copy.svg";
+
+type Props = {
+  copyLink: string;
+  downloadLink: string;
+};
+
+const DownloadArea = ({ copyLink, downloadLink }: Props) => {
+  const { copy, copied } = useCopy();
+  return (
+    <div className="flex flex-col-reverse gap-2 items-center">
+      <button
+        className="hidden md:block whitespace-nowrap"
+        disabled={copied}
+        onClick={copy.bind(null, copyLink, false)}
+      >
+        <IconCopy className="size-6 fill-gray-500 dark:fill-gray-400" />
+      </button>
+      <a className="hidden md:block whitespace-nowrap" download={name} href={downloadLink}>
+        <IconDownload className="fill-gray-500 dark:fill-gray-400" />
+      </a>
+    </div>
+  );
+};
+
+export default DownloadArea;

src/components/FileMessage/OtherFileMessage.tsx

@@ -4,9 +4,9 @@ import clsx from "clsx";
 import { User } from "@/types/user";
 import { formatBytes, fromNowTime, getFileIcon } from "@/utils";
 import IconClose from "@/assets/icons/close.circle.svg";
-import IconDownload from "@/assets/icons/download.svg";
 import ExpiredMessage from "./ExpiredMessage";
 import Progress from "./Progress";
+import DownloadArea from "./DownloadArea";
 
 type Props = {
   content: string;
@@ -87,13 +87,7 @@ const OtherFileMessage = ({
         {sending ? (
           <IconClose className="cursor-pointer" onClick={handleCancel} />
         ) : (
-          <a
+          <DownloadArea copyLink={content} downloadLink={`${content}&download=true`} />
-            className="hidden md:block whitespace-nowrap"
-            download={name}
-            href={`${content}&download=true`}
-          >
-            <IconDownload className="fill-gray-500 dark:fill-gray-400" />
-          </a>
         )}
       </div>
     </div>

src/components/FileMessage/VideoMessage.tsx

@@ -6,6 +6,7 @@ import IconDownload from "@/assets/icons/download.svg";
 import IconVideo from "@/assets/icons/file.video.svg";
 import { formatBytes } from "../../utils";
 import ExpiredMessage from "./ExpiredMessage";
+import DownloadArea from "./DownloadArea";
 
 type Props = {
   url: string;
@@ -66,9 +67,7 @@ const VideoMessage = ({ url, name, size, download }: Props) => {
             <span className="text-gray-400">{_size}</span>
           </div>
         </div>
-        <a href={download} className="hidden md:block mt-2">
+        <DownloadArea copyLink={download} downloadLink={download} />
-          <IconDownload className="fill-white" />
-        </a>
       </div>
       {!canPlay && !error ? (
         <div className={tipClass}>

src/routes/onboarding/steps/admin-account.tsx

@@ -17,7 +17,7 @@ type Props = {
 const AdminAccount: FC<Props> = ({ serverName }) => {
   const { t } = useTranslation("welcome", { keyPrefix: "onboarding" });
   const { nextStep } = useWizard();
-  const formRef = useRef<HTMLFormElement | undefined>();
+  const formRef = useRef<HTMLFormElement>(null);
   const loggedIn = useAppSelector((store) => !!store.authData.token, shallowEqual);
   const dispatch = useDispatch();
   const [createAdmin, { isLoading: isSigningUp, isError: signUpError, isSuccess: signUpOk }] =
@@ -65,6 +65,8 @@ const AdminAccount: FC<Props> = ({ serverName }) => {
   // After updated server
   useEffect(() => {
     if (isUpdatedServer) {
+      console.log({ isUpdatedServer });
+
       nextStep();
     }
   }, [isUpdatedServer]);

src/routes/onboarding/steps/who-can-sign-up.tsx

@@ -12,19 +12,15 @@ export default function SignUpSetting() {
   const { t } = useTranslation("welcome");
   const { t: st } = useTranslation("setting");
   const { nextStep } = useWizard();
-  const { data: loginConfig, refetch } = useGetLoginConfigQuery();
+  const { data: loginConfig } = useGetLoginConfigQuery();
   const [updateLoginConfig, { isSuccess, error }] = useUpdateLoginConfigMutation();
 
   const [value, setValue] = useState<WhoCanSignUp>();
-  useEffect(() => {
-    refetch();
-  }, []);
 
   // Sync to `value` when `loginConfig` is fetched
   useEffect(() => {
     if (loginConfig) {
       console.log("login config", loginConfig.who_can_sign_up);
-
       setValue(loginConfig.who_can_sign_up);
     }
   }, [loginConfig]);
@@ -39,7 +35,7 @@ export default function SignUpSetting() {
   useEffect(() => {
     if (isSuccess) nextStep();
   }, [isSuccess]);
-
+  if (!loginConfig) return null;
   return (
     <div className="h-full px-2 flex-center flex-col text-center w-full md:w-[512px] m-auto dark:text-gray-100">
       <span className="font-bold text-2xl mb-2">{t("onboarding.invite_title")}</span>

src/widget/Popup/Login/index.tsx

@@ -17,8 +17,10 @@ import useGithubAuthConfig from "../../../hooks/useGithubAuthConfig";
 import useGoogleAuthConfig from "../../../hooks/useGoogleAuthConfig";
 import { useWidget } from "../../WidgetContext";
 import Loading from "@/components/Loading";
+import { WIDGET_USER_PWD } from "@/app/config";
 
 // type Props = {}
+let currInput = { email: "", name: "" };
 const randomText = () => (Math.random() + 1).toString(36).substring(7);
 const Login = () => {
   const { t } = useTranslation("widget");
@@ -38,7 +40,7 @@ const Login = () => {
       widget_id: id,
       name: _name,
       email: _email,
-      password: `${_name}${_email}${rand}`
+      password: WIDGET_USER_PWD
     });
   };
   const handleSubmit = (evt: FormEvent<HTMLFormElement>) => {
@@ -52,10 +54,9 @@ const Login = () => {
     const data = new FormData(form);
     const name = data.get("username") as string;
     const email = data.get("email") as string;
-    // const email = data.get("email") as string;
+    // for use later
-    console.log("name", name);
+    currInput = { email, name };
     registerUser({ name, email, auto: false });
-    // const content = new FormData(form).get("prompt") as string;
   };
   useEffect(() => {
     if (autoReg && !token) {
@@ -67,7 +68,7 @@ const Login = () => {
 
   useEffect(() => {
     if (tokenLoginError) {
-      toast.error("Token login error!");
+      toast.error("Login error!");
     }
   }, [tokenLoginError]);
   useEffect(() => {
@@ -80,12 +81,16 @@ const Login = () => {
     if (error) {
       switch (error.status) {
         case 409:
-          toast.error("Email existed already!");
+          {
-          // login({
+            // toast.error("Email existed already!");
-          //   name: data?.name,
+            // try to login
-          //   email: data?.email,
+            loginByToken({
-          //   password
+              email: currInput.email,
-          // })
+              password: WIDGET_USER_PWD,
+              type: "password"
+            });
+          }
+
           break;
         default:
           toast.error("Something error!");