feat: allow editing of my posts

src/components/Button.jsx

@@ -51,4 +51,4 @@ const Button = ({
   );
 };
 
-export default Button;
+export default React.memo(Button);

src/components/Chip.jsx

@@ -26,4 +26,4 @@ const Chip = ({
   );
 };
 
-export default Chip;
+export default React.memo(Chip);

src/components/Dropdown.jsx

@@ -25,4 +25,4 @@ const Dropdown = ({ value, options, onChange, className }) => {
   );
 };
 
-export default Dropdown;
+export default React.memo(Dropdown);

src/components/ErrorMessage.jsx

@@ -9,4 +9,4 @@ const ErrorMessage = ({ className, children }) => {
   );
 };
 
-export default ErrorMessage;
+export default React.memo(ErrorMessage);

src/components/Navbar.jsx

@@ -22,8 +22,8 @@ const Navbar = () => {
   }, [keycloak]);
 
   const connectionStateCaption = {
-    connected: "Jste online",
-    offline: "Jste offline",
+    connected: "Jsi online",
+    offline: "Jsi offline",
     connecting: "Probíhá připojování",
   }[connectionState];
 

src/components/annoucements/Announcement.jsx

@@ -20,7 +20,7 @@ const Announcement = ({
   onSeen,
 }) => {
   const { ref, inView } = useInView({
-    threshold: 1,
+    threshold: 0.8,
     trackVisibility: true,
     delay: 1500,
     skip: seen,

src/components/posts/Post.jsx

@@ -19,8 +19,8 @@ const Post = ({
   archived,
   state,
   dimIfArchived = true,
+  currentUser,
   canThumb,
-  canRunActions,
   onLike,
   onDislike,
   onHide,
@@ -35,7 +35,7 @@ const Post = ({
   onSeen,
 }) => {
   const { ref, inView } = useInView({
-    threshold: 0.9,
+    threshold: 0.8,
     trackVisibility: true,
     delay: 1500,
     skip: seen,
@@ -123,19 +123,37 @@ const Post = ({
     );
   }
 
+  const isChairman = currentUser && currentUser.role === "chairman";
+
   const showAnnounceAction =
-    type === "procedure-proposal" && state === "pending";
+    isChairman && type === "procedure-proposal" && state === "pending";
   const showAcceptAction =
-    type === "procedure-proposal" && state === "announced";
+    isChairman && type === "procedure-proposal" && state === "announced";
   const showRejectAction =
-    type === "procedure-proposal" && state === "announced";
+    isChairman && type === "procedure-proposal" && state === "announced";
   const showRejectByChairmanAction =
-    type === "procedure-proposal" && ["announced", "pending"].includes(state);
-  const showEditAction = true;
-  const showBanAction = !author.isBanned;
-  const showUnbanAction = author.isBanned;
-  const showHideAction = !archived;
-  const showArchiveAction = !archived;
+    isChairman &&
+    type === "procedure-proposal" &&
+    ["announced", "pending"].includes(state);
+  const showEditAction =
+    isChairman || (currentUser && currentUser.id === author.id);
+  const showBanAction = isChairman && !author.isBanned;
+  const showUnbanAction = isChairman && author.isBanned;
+  const showHideAction = isChairman && !archived;
+  const showArchiveAction = isChairman && !archived;
+
+  // Show actions dropdown if any of actions is available.
+  const showActions = [
+    showAnnounceAction,
+    showAcceptAction,
+    showRejectAction,
+    showRejectByChairmanAction,
+    showEditAction,
+    showBanAction,
+    showUnbanAction,
+    showHideAction,
+    showArchiveAction,
+  ].some((item) => !!item);
 
   const htmlContent = {
     __html: content,
@@ -163,7 +181,7 @@ const Post = ({
                       isToday(datetime) ? "H:mm" : "dd. MM. H:mm"
                     )}
                     {modified && (
-                      <span className="text-grey-200 text-sm block md:inline md:ml-2 underline">
+                      <span className="text-grey-200 text-sm block md:inline md:ml-2">
                         (upraveno)
                       </span>
                     )}
@@ -183,7 +201,7 @@ const Post = ({
                 onDislike={onDislike}
                 myVote={ranking.myVote}
               />
-              {canRunActions && (
+              {showActions && (
                 <DropdownMenu right className="pl-4">
                   {showAnnounceAction && (
                     <DropdownMenuItem

src/components/posts/PostList.jsx

@@ -6,8 +6,9 @@ import Post from "./Post";
 const PostList = ({
   className,
   items,
+  currentUser,
   canThumb,
-  canRunActions,
+  dimArchived,
   onLike,
   onDislike,
   onHide,
@@ -20,7 +21,6 @@ const PostList = ({
   onEdit,
   onArchive,
   onSeen,
-  dimArchived,
 }) => {
   const buildHandler = (responderFn) => (post) => (evt) => {
     evt.preventDefault();
@@ -65,8 +65,8 @@ const PostList = ({
             seen={item.seen}
             archived={item.archived}
             dimIfArchived={dimArchived}
+            currentUser={currentUser}
             canThumb={canThumb}
-            canRunActions={canRunActions}
             onLike={onPostLike(item)}
             onDislike={onPostDislike(item)}
             onHide={onPostHide(item)}
@@ -85,7 +85,8 @@ const PostList = ({
         ))}
       {!items.length && (
         <p className="p-4 lg:p-0 lg:py-3">
-          Nikdo zatím žádný příspěvek do rozpravy nepřidal. Budeš první?
+          Nikdo zatím žádný odpovídající příspěvek do rozpravy nepřidal. Budeš
+          první?
         </p>
       )}
     </div>

src/containers/PostsContainer.jsx

@@ -166,12 +166,12 @@ const PostsContainer = ({ className }) => {
       <PostList
         items={windowItems.slice(sliceStart, sliceEnd)}
         canThumb={isAuthenticated}
-        canRunActions={isAuthenticated && user.role === "chairman"}
         onLike={like.run}
         onDislike={dislike.run}
         onSeen={markSeen}
         className={className}
         dimArchived={!showingArchivedOnly}
+        currentUser={user}
         onHide={setPostToHide}
         onBanUser={onBanUser}
         onUnbanUser={onUnbanUser}

src/pages/Home.jsx

@@ -205,6 +205,7 @@ const Home = () => {
                   title="Video stream"
                   controls={true}
                   playing={true}
+                  muted={true}
                   width="100%"
                   height=""
                 />

src/pages/Program.jsx

@@ -67,7 +67,11 @@ const Schedule = () => {
                   <strong>Navrhovatel:</strong>
                   <span>{entry.proposer}</span>
                 </div>
-                {entry.description && <p className="mt-2 leading-tight max-w-3xl">{entry.description}</p>}
+                {entry.description && (
+                  <p className="mt-2 leading-tight max-w-3xl">
+                    {entry.description}
+                  </p>
+                )}
                 {isAuthenticated &&
                   user.role === "chairman" &&
                   entry.id !== currentId && (

src/ws/connection.js

@@ -49,7 +49,8 @@ function Worker() {
 const buildKeepalivePayload = async () => {
   const { user } = AuthStore.getRawState();
   const payload = user && user.id ? user.id.toString() : "";
-  const signature = !!user.secret ? hmacSHA1(payload, user.secret) : null;
+  const signature =
+    user && !!user.secret ? hmacSHA1(payload, user.secret) : null;
 
   return {
     event: "KEEPALIVE",