chore: update prettier setting

2022-06-12 15:30:14 +08:00
parent 14b4678d9e
commit 516794d352
209 changed files with 2435 additions and 4588 deletions
@@ -62,12 +62,7 @@ const StyledCmds = styled.ul`
    transform: translateX(-100%);
  }
 `;
-export default function Commands({
-  context = "user",
-  contextId = 0,
-  mid = 0,
-  toggleEditMessage,
-}) {
+export default function Commands({ context = "user", contextId = 0, mid = 0, toggleEditMessage }) {
  const {
    canDelete,
    canReply,
@@ -80,11 +75,11 @@ export default function Commands({
    togglePinModal,
    PinModal,
    DeleteModal,
-    ForwardModal,
+    ForwardModal
  } = useMessageOperation({ mid, context, contextId });
  const { setReplying } = useSendMessage({ context, to: contextId });
  const { addFavorite, isFavorited } = useFavMessage({
-    cid: context == "channel" ? contextId : null,
+    cid: context == "channel" ? contextId : null
  });
  const dispatch = useDispatch();
  const [tippyVisible, setTippyVisible] = useState(false);
@@ -126,10 +121,7 @@ export default function Commands({

  return (
    <>
-      <StyledCmds
-        ref={cmdsRef}
-        className={`cmds ${tippyVisible ? "visible" : ""}`}
-      >
+      <StyledCmds ref={cmdsRef} className={`cmds ${tippyVisible ? "visible" : ""}`}>
        <Tippy
          onShow={handleTippyVisible.bind(null, true)}
          onHide={handleTippyVisible.bind(null, false)}
@@ -175,25 +167,25 @@ export default function Commands({
                canPin && {
                  title: pinned ? `Unpin Message` : `Pin Message`,
                  icon: <IconPin className="icon" />,
-                  handler: pinned ? handleUnpin : togglePinModal,
+                  handler: pinned ? handleUnpin : togglePinModal
                },
                {
                  title: "Forward",
                  icon: <IconForward className="icon" />,
-                  handler: toggleForwardModal,
+                  handler: toggleForwardModal
                },
                {
                  title: "Select",
                  icon: <IconSelect className="icon" />,
-                  handler: handleSelect.bind(null, mid),
+                  handler: handleSelect.bind(null, mid)
                },

                canDelete && {
                  title: " Delete",
                  danger: true,
                  icon: <IconDelete className="icon" />,
-                  handler: toggleDeleteModal,
-                },
+                  handler: toggleDeleteModal
+                }
              ]}
            />
          }
@@ -20,7 +20,7 @@ export default function MessageContextMenu({
  visible,
  hide,
  editMessage,
-  children,
+  children
 }) {
  const {
    copyContent,
@@ -37,7 +37,7 @@ export default function MessageContextMenu({
    togglePinModal,
    PinModal,
    ForwardModal,
-    DeleteModal,
+    DeleteModal
  } = useMessageOperation({ mid, contextId, context });
  const dispatch = useDispatch();
  const { setReplying } = useSendMessage({ context, to: contextId });
@@ -71,39 +71,39 @@ export default function MessageContextMenu({
              canEdit && {
                title: "Edit Message",
                icon: <IconEdit className="icon" />,
-                handler: editMessage,
+                handler: editMessage
              },
              canReply && {
                title: "Reply",
                icon: <IconReply className="icon" />,
-                handler: handleReply,
+                handler: handleReply
              },
              canCopy && {
                title: "Copy",
                icon: <IconCopy className="icon" />,
-                handler: copyContent,
+                handler: copyContent
              },
              canPin && {
                title: pinned ? "Unpin" : "Pin",
                icon: <IconPin className="icon" />,
-                handler: pinned ? unPin.bind(null, mid) : togglePinModal,
+                handler: pinned ? unPin.bind(null, mid) : togglePinModal
              },
              {
                title: "Forward",
                icon: <IconForward className="icon" />,
-                handler: toggleForwardModal,
+                handler: toggleForwardModal
              },
              {
                title: "Select",
                icon: <IconSelect className="icon" />,
-                handler: handleSelect,
+                handler: handleSelect
              },
              canDelete && {
                title: "Delete",
                danger: true,
                icon: <IconDelete className="icon" />,
-                handler: toggleDeleteModal,
-              },
+                handler: toggleDeleteModal
+              }
            ]}
          />
        }
@@ -91,7 +91,7 @@ export default function EditMessage({ mid, cancelEdit }) {
    edit({
      mid,
      content: currMsg,
-      type: msg.content_type == ContentTypes.markdown ? "markdown" : "text",
+      type: msg.content_type == ContentTypes.markdown ? "markdown" : "text"
    });
  };
  if (!msg) return null;
@@ -121,8 +121,7 @@ export default function EditMessage({ mid, cancelEdit }) {
          esc to <button onClick={cancelEdit}>cancel</button>
        </span>
        <span className="opt">
-          enter to{" "}
-          <button onClick={handleSave}>{isEditing ? "saving" : `save`}</button>
+          enter to <button onClick={handleSave}>{isEditing ? "saving" : `save`}</button>
        </span>
      </div>
    </StyledWrapper>
@@ -23,20 +23,10 @@ const FavoritedMessage = ({ id }) => {
      const favorite_mids = messages.map(({ from_mid }) => from_mid) || [];

      setMsgs(
-        <StyledFav
-          data-favorite-mids={favorite_mids.join(",")}
-          className="favorite"
-        >
+        <StyledFav data-favorite-mids={favorite_mids.join(",")} className="favorite">
          <div className="list">
            {messages.map((msg, idx) => {
-              const {
-                user = {},
-                download,
-                content,
-                content_type,
-                properties,
-                thumbnail,
-              } = msg;
+              const { user = {}, download, content, content_type, properties, thumbnail } = msg;
              return (
                <StyledMsg className="archive" key={idx}>
                  {user && (
@@ -54,7 +44,7 @@ const FavoritedMessage = ({ id }) => {
                        content,
                        content_type,
                        properties,
-                        thumbnail,
+                        thumbnail
                      })}
                    </div>
                  </div>
@@ -56,7 +56,7 @@ const ForwardedMessage = ({ context, to, from_uid, id }) => {
                content,
                content_type,
                properties,
-                thumbnail,
+                thumbnail
              } = msg;
              return (
                <StyledMsg className="archive" key={idx}>
@@ -78,7 +78,7 @@ const ForwardedMessage = ({ context, to, from_uid, id }) => {
                        content,
                        content_type,
                        properties,
-                        thumbnail,
+                        thumbnail
                      })}
                    </div>
                  </div>
@@ -9,14 +9,7 @@ export default function PreviewMessage({ mid = 0 }) {
    return { msg: store.message[mid], contactsData: store.contacts.byId };
  });
  if (!msg) return null;
-  const {
-    from_uid,
-    created_at,
-    content_type,
-    content,
-    thumbnail,
-    properties,
-  } = msg;
+  const { from_uid, created_at, content_type, content, thumbnail, properties } = msg;
  const { name, avatar } = contactsData[from_uid];
  return (
    <StyledWrapper className={`preview`}>
@@ -26,9 +19,7 @@ export default function PreviewMessage({ mid = 0 }) {
      <div className="details">
        <div className="up">
          <span className="name">{name}</span>
-          <i className="time">
-            {dayjs(created_at).format("YYYY-MM-DD h:mm:ss A")}
-          </i>
+          <i className="time">{dayjs(created_at).format("YYYY-MM-DD h:mm:ss A")}</i>
        </div>
        <div className={`down`}>
          {renderContent({
@@ -36,7 +27,7 @@ export default function PreviewMessage({ mid = 0 }) {
            content,
            thumbnail,
            from_uid,
-            properties,
+            properties
          })}
        </div>
      </div>
@@ -70,8 +70,7 @@ const StyledDetails = styled.div`
  position: relative;
  background: #ffffff;
  border-radius: var(--br);
-  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08),
-    0px 4px 6px -2px rgba(16, 24, 40, 0.03);
+  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
  display: flex;
  align-items: flex-start;
  gap: 8px;
@@ -132,7 +131,7 @@ export default function Reaction({ mid, reactions = null }) {
  const [reactWithEmoji] = useReactMessageMutation();
  const { currUid } = useSelector((store) => {
    return {
-      currUid: store.authData.uid,
+      currUid: store.authData.uid
    };
  });
  const handleReact = (emoji) => {
@@ -156,18 +155,14 @@ export default function Reaction({ mid, reactions = null }) {
              // visible={true}
              interactive
              placement="top"
-              content={
-                <ReactionDetails uids={uids} emoji={reaction} index={idx} />
-              }
+              content={<ReactionDetails uids={uids} emoji={reaction} index={idx} />}
            >
              <i className="emoji">
                <ReactionItem native={reaction} />
              </i>
            </Tippy>

-            {uids.length > 1 ? (
-              <em className="count">{`${uids.length}`} </em>
-            ) : null}
+            {uids.length > 1 ? <em className="count">{`${uids.length}`} </em> : null}
          </span>
        ) : null;
      })}
@@ -41,7 +41,7 @@ export default function ReactionPicker({ mid, hidePicker }) {
  const { reactionData, currUid } = useSelector((store) => {
    return {
      reactionData: store.reactionMessage[mid] || {},
-      currUid: store.authData.uid,
+      currUid: store.authData.uid
    };
  });
  // useOutsideClick(wrapperRef, hidePicker);
@@ -55,8 +55,7 @@ export default function ReactionPicker({ mid, hidePicker }) {
      <ul className={`emojis ${isLoading ? "reacting" : ""}`}>
        {Emojis.map((emoji) => {
          let reacted =
-            reactionData[emoji] &&
-            reactionData[emoji].findIndex((id) => id == currUid) > -1;
+            reactionData[emoji] && reactionData[emoji].findIndex((id) => id == currUid) > -1;

          return (
            <li
@@ -66,11 +66,7 @@ const Styled = styled.div`
        width: 100%;
        height: 100%;
        content: "";
-        background: linear-gradient(
-          180deg,
-          rgba(255, 255, 255, 0) 63.54%,
-          #e5e7eb 93.09%
-        );
+        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 63.54%, #e5e7eb 93.09%);
      }
    }
    .pic {
@@ -26,26 +26,24 @@ function Message({
  mid = "",
  context = "user",
  updateReadIndex,
-  read = true,
+  read = true
 }) {
-  const {
-    visible: contextMenuVisible,
-    handleContextMenuEvent,
-    hideContextMenu,
-  } = useContextMenu();
+  const { visible: contextMenuVisible, handleContextMenuEvent, hideContextMenu } = useContextMenu();
  const inviewRef = useInView();
  const [edit, setEdit] = useState(false);
  const avatarRef = useRef(null);
  const { getPinInfo } = usePinMessage(context == "channel" ? contextId : null);
-  const { message = {}, reactionMessageData, contactsData } = useSelector(
-    (store) => {
-      return {
-        reactionMessageData: store.reactionMessage,
-        message: store.message[mid] || {},
-        contactsData: store.contacts.byId,
-      };
-    }
-  );
+  const {
+    message = {},
+    reactionMessageData,
+    contactsData
+  } = useSelector((store) => {
+    return {
+      reactionMessageData: store.reactionMessage,
+      message: store.message[mid] || {},
+      contactsData: store.contacts.byId
+    };
+  });

  const toggleEditMessage = () => {
    setEdit((prev) => !prev);
@@ -61,7 +59,7 @@ function Message({
    download,
    content_type = "text/plain",
    edited,
-    properties,
+    properties
  } = message;

  useEffect(() => {
@@ -79,11 +77,7 @@ function Message({
  // if (!message) return null;
  let timePrefix = null;
  const dayjsTime = dayjs(time);
-  timePrefix = dayjsTime.isToday()
-    ? "Today"
-    : dayjsTime.isYesterday()
-    ? "Yesterday"
-    : null;
+  timePrefix = dayjsTime.isToday() ? "Today" : dayjsTime.isYesterday() ? "Yesterday" : null;

  const pinInfo = getPinInfo(mid);
  // return null;
@@ -94,9 +88,9 @@ function Message({
      onContextMenu={handleContextMenuEvent}
      data-msg-mid={mid}
      ref={inviewRef}
-      className={`message ${readOnly ? "readonly" : ""} ${
-        pinInfo ? "pinned" : ""
-      } ${contextMenuVisible ? "contextVisible" : ""} `}
+      className={`message ${readOnly ? "readonly" : ""} ${pinInfo ? "pinned" : ""} ${
+        contextMenuVisible ? "contextVisible" : ""
+      } `}
    >
      <Tippy
        key={_key}
@@ -153,7 +147,7 @@ function Message({
                content,
                thumbnail,
                download,
-                edited,
+                edited
              })
            )}
            {reactions && <Reaction mid={mid} reactions={reactions} />}
@@ -20,7 +20,7 @@ const renderContent = ({
  content,
  download,
  thumbnail,
-  edited = false,
+  edited = false
 }) => {
  let ctn = null;
  switch (content_type) {
@@ -30,38 +30,23 @@ const renderContent = ({
          <Linkit
            componentDecorator={(decoratedHref, decoratedText, key) => (
              <React.Fragment key={key}>
-                <a
-                  className="link"
-                  target="_blank"
-                  href={decoratedHref}
-                  key={key}
-                  rel="noreferrer"
-                >
+                <a className="link" target="_blank" href={decoratedHref} key={key} rel="noreferrer">
                  {decoratedText}
                </a>
-                {!decoratedHref.startsWith("mailto") && (
-                  <URLPreview url={decoratedHref} />
-                )}
+                {!decoratedHref.startsWith("mailto") && <URLPreview url={decoratedHref} />}
              </React.Fragment>
            )}
          >
-            {reactStringReplace(
-              content,
-              /(\s{1}@[0-9]+\s{1})/g,
-              (match, idx) => {
-                console.log("match", match);
-                const uid = match.trim().slice(1);
-                return <Mention key={idx} uid={uid} cid={to} />;
-              }
-            )}
+            {reactStringReplace(content, /(\s{1}@[0-9]+\s{1})/g, (match, idx) => {
+              console.log("match", match);
+              const uid = match.trim().slice(1);
+              return <Mention key={idx} uid={uid} cid={to} />;
+            })}
            {/* {content.replace(/\s{1}\@[1-9]+\s{1}/g,)} */}
            {/* {new RegExp(/\s{1}\@[1-9]+\s{1}/g).exec(content)} */}
          </Linkit>
          {edited && (
-            <span
-              className="edited"
-              title={dayjs(edited).format("YYYY-MM-DD h:mm:ss A")}
-            >
+            <span className="edited" title={dayjs(edited).format("YYYY-MM-DD h:mm:ss A")}>
              (edited)
            </span>
          )}
@@ -10,17 +10,15 @@ import usePinMessage from "../../hook/usePinMessage";

 export default function useMessageOperation({ mid, context, contextId }) {
  const { copy } = useCopy();
-  const { content_type, properties, currUid, from_uid, content } = useSelector(
-    (store) => {
-      return {
-        content: store.message[mid]?.content,
-        from_uid: store.message[mid]?.from_uid,
-        content_type: store.message[mid]?.content_type,
-        properties: store.message[mid]?.properties,
-        currUid: store.authData.uid,
-      };
-    }
-  );
+  const { content_type, properties, currUid, from_uid, content } = useSelector((store) => {
+    return {
+      content: store.message[mid]?.content,
+      from_uid: store.message[mid]?.from_uid,
+      content_type: store.message[mid]?.content_type,
+      properties: store.message[mid]?.properties,
+      currUid: store.authData.uid
+    };
+  });
  const { canPin, pins, unpinMessage, isUnpinSuccess } = usePinMessage(
    context == "channel" ? contextId : undefined
  );
@@ -71,16 +69,11 @@ export default function useMessageOperation({ mid, context, contextId }) {
    properties?.content_type &&
    properties?.content_type.startsWith("image");
  const enableEdit =
-    currUid == from_uid &&
-    [ContentTypes.text, ContentTypes.markdown].includes(content_type);
+    currUid == from_uid && [ContentTypes.text, ContentTypes.markdown].includes(content_type);
  const canDelete = currUid == from_uid;
-  const canCopy =
-    [ContentTypes.text, ContentTypes.markdown].includes(content_type) ||
-    isImage;
+  const canCopy = [ContentTypes.text, ContentTypes.markdown].includes(content_type) || isImage;
  return {
-    copyContent: isImage
-      ? copyContent.bind(null, true)
-      : copyContent.bind(null, false),
+    copyContent: isImage ? copyContent.bind(null, true) : copyContent.bind(null, false),
    canCopy,
    isImage,
    isMarkdown: content_type == ContentTypes.markdown,
@@ -101,6 +94,6 @@ export default function useMessageOperation({ mid, context, contextId }) {
    ) : null,
    PinModal: pinModalVisible ? (
      <PinMessageModal mid={mid} gid={contextId} closeModal={togglePinModal} />
-    ) : null,
+    ) : null
  };
 }