chore: fixs tweaks and update texts

src/app/config.js

@@ -1,6 +1,6 @@
 // const BASE_URL = `${location.origin}/api`;
 const BASE_URL = `https://dev.rustchat.com/api`;
-export const CACHE_VERSION = `0.2.12`;
+export const CACHE_VERSION = `0.2.13`;
 // const BASE_URL = `https://rustchat.net/api`;
 export const ContentTypes = {
   text: "text/plain",
@@ -33,6 +33,7 @@ export const KEY_UID = "RUSTCHAT_CURR_UID";
 export const KEY_DEVICE_KEY = "RUSTCHAT_DEVICE_KEY";
 export const KEY_USERS_VERSION = "RUSTCHAT_USERS_VERSION";
 export const KEY_AFTER_MID = "RUSTCHAT_AFTER_MID";
+export const KEY_PWA_INSTALLED = "RUSTCHAT_PWA_INSTALLED";
 export const Emojis = ["👍", "❤️", "😄", "👀", "👎", "🎉", "🙁", "🚀"];
 export const Views = {
   item: "item",

src/app/slices/auth.data.js

@@ -1,5 +1,11 @@
 import { createSlice } from "@reduxjs/toolkit";
-import { KEY_REFRESH_TOKEN, KEY_TOKEN, KEY_UID, KEY_EXPIRE } from "../config";
+import {
+  KEY_PWA_INSTALLED,
+  KEY_REFRESH_TOKEN,
+  KEY_TOKEN,
+  KEY_UID,
+  KEY_EXPIRE,
+} from "../config";
 const initialState = {
   uid: null,
   token: localStorage.getItem(KEY_TOKEN),
@@ -43,6 +49,8 @@ const authDataSlice = createSlice({
       localStorage.removeItem(KEY_TOKEN);
       localStorage.removeItem(KEY_REFRESH_TOKEN);
       localStorage.removeItem(KEY_UID);
+      localStorage.removeItem(KEY_PWA_INSTALLED);
+
       return emptyState;
     },
     setUid(state, action) {

src/common/component/ManageMembers.js

@@ -164,7 +164,9 @@ export default function ManageMembers({ cid = null }) {
                 </div>
               </div>
               <div className="right">
-                <span className="role">{is_admin ? "Admin" : "User"}</span>
+                <span className="role">
+                  {is_admin ? "Admin" : cid ? "Member" : "User"}
+                </span>
                 <Tippy
                   duration={0}
                   delay={[0, 0]}

src/common/component/Manifest/Prompt.js

@@ -51,9 +51,7 @@ export default function Prompt({ handleInstall, closePrompt }) {
         <IconClose className="close" onClick={closePrompt} />
         <div className="tip">
           <h2 className="title">Install web app on desktop?</h2>
-          <p className="desc">
+          <p className="desc">Add to desktop for quick access to this app.</p>
-            Put it on your desktop for quick access to apps.
-          </p>
         </div>
         <div className="btns">
           <Button className="ghost cancel small" onClick={closePrompt}>

src/common/component/Manifest/index.js

@@ -5,7 +5,7 @@ import Prompt from "./Prompt";
 import usePrompt from "./usePrompt";
 
 export default function Manifest() {
-  const { setCanneled } = usePrompt();
+  const { setCanneled, prompted } = usePrompt();
   const deferredPromptRef = useRef(null);
   const [popup, setPopup] = useState(false);
   // const { data, isSuccess } = useGetServerQuery();
@@ -62,6 +62,6 @@ export default function Manifest() {
     setCanneled();
     setPopup(false);
   };
-  if (!popup) return null;
+  if (!popup || prompted) return null;
   return <Prompt handleInstall={handleInstall} closePrompt={handleClose} />;
 }

src/common/component/Manifest/usePrompt.js

@@ -1,16 +1,16 @@
 // import React from "react";
-const Key = `RUSTCHAT_PWA_PROMPT`;
+import { KEY_PWA_INSTALLED } from "../../../app/config";
 export default function usePrompt() {
   const resetPrompt = () => {
-    localStorage.removeItem(Key);
+    localStorage.removeItem(KEY_PWA_INSTALLED);
   };
   const setPrompt = () => {
-    localStorage.setItem(Key, true);
+    localStorage.setItem(KEY_PWA_INSTALLED, true);
   };
 
   return {
     setCanneled: setPrompt,
-    prompted: !!localStorage.getItem(Key),
+    prompted: !!localStorage.getItem(KEY_PWA_INSTALLED),
     resetPrompt,
   };
 }

src/common/component/Message/index.js

@@ -100,7 +100,9 @@ function Message({
         onContextMenu={handleContextMenuEvent}
         data-msg-mid={mid}
         ref={inviewRef}
-        className={`message ${readOnly ? "readonly" : ""}`}
+        className={`message ${readOnly ? "readonly" : ""} ${
+          contextMenuVisible ? "contextVisible" : ""
+        } `}
       >
         <Tippy
           disabled={readOnly}

src/common/component/Message/styled.js

@@ -16,6 +16,7 @@ const StyledMsg = styled.div`
     background: #f5f6f7;
   }
   &:hover,
+  &.contextVisible,
   &.preview {
     content-visibility: inherit;
     contain-intrinsic-size: inherit;

src/common/component/Search.js

@@ -15,7 +15,7 @@ import ContactsModal from "./ContactsModal";
 const StyledWrapper = styled.div`
   position: relative;
   min-height: 56px;
-  padding: 0 10px 0 16px;
+  padding: 6px 12px;
   display: flex;
   align-items: center;
   justify-content: space-between;

src/common/component/Server.js

@@ -12,8 +12,9 @@ import ContactsModal from "./ContactsModal";
 import { NavLink, useLocation } from "react-router-dom";
 
 const StyledWrapper = styled.div`
+  min-height: 56px;
   position: relative;
-  padding: 15px 15px 15px 20px;
+  padding: 6px 12px;
   display: flex;
   align-items: center;
   justify-content: space-between;

src/routes/contacts/styled.js

@@ -9,7 +9,7 @@ const StyledWrapper = styled.div`
     position: relative;
     display: flex;
     flex-direction: column;
-    min-width: 260px;
+    min-width: 268px;
     box-shadow: inset -1px 0px 0px rgba(0, 0, 0, 0.1);
     .list {
       margin: 12px 8px;