🐛 Fix normal user can set privacy

TelwareSW · Dec 21, 2024 · 266ae17 · 266ae17
1 parent 64ef39f
commit 266ae17
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 9 deletions.
diff --git a/app/src/features/groups/GroupType.tsx b/app/src/features/groups/GroupType.tsx
@@ -14,7 +14,7 @@ const Container = styled.div`
 `;
 
 function GroupType() {
-  const { group, chatId } = useGroupInfo();
+  const { group, chatId, isCurrUserAdmin } = useGroupInfo();
   const { setPrivacy } = useSocket();
   const [selectedGroupType, setSelectedGroupType] = useState<
     "private" | "public"
@@ -35,12 +35,14 @@ function GroupType() {
         selected={selectedGroupType === "private"}
         onClick={() => handleSelection("private")}
         groupType={group?.type}
+        isAdmin={isCurrUserAdmin}
       />
       <GroupTypeOption
         type="public"
         selected={selectedGroupType === "public"}
         onClick={() => handleSelection("public")}
         groupType={group?.type}
+        isAdmin={isCurrUserAdmin}
       />
     </Container>
   );

diff --git a/app/src/features/groups/GroupTypeOption.tsx b/app/src/features/groups/GroupTypeOption.tsx
@@ -1,24 +1,29 @@
 import styled from "styled-components";
 
-const Option = styled.div`
+const Option = styled.div<{ disabled: boolean }>`
   display: flex;
   align-items: center;
   gap: 1rem;
-  cursor: pointer;
+
+  cursor: ${({ disabled }) => (disabled ? "not-allowed" : "pointer")};
 `;
 
-const RadioButton = styled.div<{ selected: boolean }>`
+const RadioButton = styled.button<{ selected: boolean; disabled: boolean }>`
+  background: transparent;
   flex-shrink: 0;
+
   width: 1.2rem;
   height: 1.2rem;
+
+  border-radius: 50%;
   border: 2px solid
     ${({ selected }) =>
       selected ? "var(--accent-color)" : "var(--color-text-secondary)"};
-  border-radius: 50%;
+  
   display: flex;
   align-items: center;
   justify-content: center;
-  cursor: pointer;
+  cursor: ${({ disabled }) => (disabled ? "not-allowed" : "pointer")};
 
   &::after {
     content: "";
@@ -49,6 +54,7 @@ const Description = styled.p`
 interface GroupTypeOptionProps {
   type: "private" | "public";
   selected: boolean;
+  isAdmin: boolean;
   onClick: () => void;
   groupType: string | undefined;
 }
@@ -57,10 +63,11 @@ const GroupTypeOption = ({
   type,
   selected,
   onClick,
-  groupType
+  groupType,
+  isAdmin
 }: GroupTypeOptionProps) => (
-  <Option onClick={onClick}>
-    <RadioButton selected={selected} />
+  <Option disabled={!isAdmin} onClick={onClick}>
+    <RadioButton selected={selected} disabled={!isAdmin} />
     <Details>
       <Title>{`${type.charAt(0).toUpperCase() + type.slice(1)} ${groupType}`}</Title>
       <Description>

diff --git a/app/src/sockets/SocketProvider.tsx b/app/src/sockets/SocketProvider.tsx
@@ -224,6 +224,10 @@ function SocketProvider({ children }: SocketProviderProps) {
       console.log("SET_PERMISSION_SERVER", chatId, type, who);
       queryClient.invalidateQueries({ queryKey: ["chats"] });
     });
+    socket.on("SET_PRIVACY_SERVER", ({ chatId, privacy }) => {
+      console.log("SET_PERMISSION_SERVER", chatId, privacy);
+      queryClient.invalidateQueries({ queryKey: ["chats"] });
+    });
 
     socket.on("typing", (isTyping, message) =>
       handleIsTyping(dispatch, isTyping, message.chatId)