From 24fbbab6c0144f8103d60e4c36d6fa343b9ff59c Mon Sep 17 00:00:00 2001
From: HF <pixelplanetdev@gmail.com>
Date: Thu, 29 Apr 2021 04:36:15 +0200
Subject: [PATCH] fix chat container height fix login input width fix context
 menu closing

---
 src/actions/index.js            | 14 +-------------
 src/components/ChatButton.jsx   |  2 +-
 src/components/LogInForm.jsx    |  2 +-
 src/components/Window.jsx       |  4 ++--
 src/components/windows/Chat.jsx | 12 ------------
 src/reducers/chat.js            | 12 ++++++++++--
 src/reducers/contextMenu.js     | 13 +++++++++++++
 src/styles/default.css          |  4 ++--
 8 files changed, 30 insertions(+), 33 deletions(-)

diff --git a/src/actions/index.js b/src/actions/index.js
index 7772874..d46ab22 100644
--- a/src/actions/index.js
+++ b/src/actions/index.js
@@ -37,12 +37,6 @@ export function closeAlert(): Action {
   };
 }
 
-export function toggleChatBox(): Action {
-  return {
-    type: 'TOGGLE_CHAT_BOX',
-  };
-}
-
 export function toggleHistoricalView(): Action {
   return {
     type: 'TOGGLE_HISTORICAL_VIEW',
@@ -662,12 +656,6 @@ export function showContextMenu(
   };
 }
 
-// TODO CHAT MODAL
-export function showChatModal(forceModal: boolean = false): Action {
-  if (window.innerWidth > 604 && !forceModal) { return toggleChatBox(); }
-  return showModal('CHAT');
-}
-
 export function openChatChannel(cid: number): Action {
   return {
     type: 'OPEN_CHAT_CHANNEL',
@@ -737,7 +725,7 @@ export function setChatChannel(windowId: number, cid: number): Action {
   return {
     type: 'SET_CHAT_CHANNEL',
     windowId,
-    cid,
+    cid: Number(cid),
   };
 }
 
diff --git a/src/components/ChatButton.jsx b/src/components/ChatButton.jsx
index 92e8c5a..0971b8a 100644
--- a/src/components/ChatButton.jsx
+++ b/src/components/ChatButton.jsx
@@ -10,7 +10,7 @@ import { connect } from 'react-redux';
 import { MdForum } from 'react-icons/md';
 import { t } from 'ttag';
 
-import { showChatModal, openChatWindow } from '../actions';
+import { openChatWindow } from '../actions';
 
 
 const ChatButton = ({
diff --git a/src/components/LogInForm.jsx b/src/components/LogInForm.jsx
index 9ad2044..51f8f18 100644
--- a/src/components/LogInForm.jsx
+++ b/src/components/LogInForm.jsx
@@ -27,7 +27,7 @@ function validate(nameoremail, password) {
 
 const inputStyles = {
   display: 'inline-block',
-  width: '100%',
+  width: '75%',
   maxWidth: '35em',
 };
 
diff --git a/src/components/Window.jsx b/src/components/Window.jsx
index a3268c3..0550ae8 100644
--- a/src/components/Window.jsx
+++ b/src/components/Window.jsx
@@ -25,7 +25,7 @@ const Window = ({ id }) => {
 
   const startMove = useCallback((event) => {
     event.preventDefault();
-    dispatch(focusWindow());
+    dispatch(focusWindow(id));
 
     let {
       clientX: startX,
@@ -52,7 +52,7 @@ const Window = ({ id }) => {
 
   const startResize = useCallback((event) => {
     event.preventDefault();
-    dispatch(focusWindow());
+    dispatch(focusWindow(id));
 
     let {
       clientX: startX,
diff --git a/src/components/windows/Chat.jsx b/src/components/windows/Chat.jsx
index 19c6d96..9f80700 100644
--- a/src/components/windows/Chat.jsx
+++ b/src/components/windows/Chat.jsx
@@ -15,7 +15,6 @@ import ChannelDropDown from '../ChannelDropDown';
 
 import {
   showUserAreaModal,
-  showChatModal,
   setChatChannel,
   setChatInputMessage,
   fetchChatMessages,
@@ -30,7 +29,6 @@ function escapeRegExp(string) {
 
 const Chat = ({
   windowId,
-  showExpand,
 }) => {
   const listRef = useRef();
   const targetRef = useRef();
@@ -139,16 +137,6 @@ const Chat = ({
           title={t`Channel settings`}
           tabIndex={-1}
         >⚙</span>
-        &nbsp;
-        {(showExpand)
-          && (
-          <span
-            onClick={() => dispatch(showChatModal())}
-            role="button"
-            title={t`maximize`}
-            tabIndex={-1}
-          >↷</span>
-          )}
       </div>
       <ul
         className="chatarea"
diff --git a/src/reducers/chat.js b/src/reducers/chat.js
index edca1cf..cec08dd 100644
--- a/src/reducers/chat.js
+++ b/src/reducers/chat.js
@@ -41,9 +41,17 @@ export default function chat(
   switch (action.type) {
     case 'RECEIVE_ME':
     case 'LOGIN': {
+      // making sure object keys are numbers
+      const channels = {};
+      const channelsJson = action.channels;
+      const cids = Object.keys(channelsJson);
+      for (let i = 0; i < cids.length; i += 1) {
+        const cid = cids[i];
+        channels[Number(cid)] = channelsJson[cid];
+      }
       return {
         ...state,
-        channels: action.channels,
+        channels,
         blocked: action.blocked,
       };
     }
@@ -106,7 +114,7 @@ export default function chat(
 
     case 'ADD_CHAT_CHANNEL': {
       const { channel } = action;
-      const [cid] = Object.keys(channel);
+      const cid = Number(Object.keys(channel)[0]);
       if (state.channels[cid]) {
         return state;
       }
diff --git a/src/reducers/contextMenu.js b/src/reducers/contextMenu.js
index e56f26d..cea00a5 100644
--- a/src/reducers/contextMenu.js
+++ b/src/reducers/contextMenu.js
@@ -32,6 +32,19 @@ export default function contextMenu(
       const {
         menuType, xPos, yPos, args,
       } = action;
+      // if the same context menu is already open, close it
+      if (state.menuOpen && state.menuType === menuType
+        && !(
+          Object.keys(state.args).length === Object.keys(args).length
+          && Object.keys(state.args).every(
+            (key) => state.args[key] === args[key],
+          )
+        )) {
+        return {
+          ...state,
+          menuOpen: false,
+        };
+      }
       return {
         ...state,
         menuType,
diff --git a/src/styles/default.css b/src/styles/default.css
index 01463c9..2a6d1c2 100644
--- a/src/styles/default.css
+++ b/src/styles/default.css
@@ -193,7 +193,7 @@ tr:nth-child(even) {
   display: flex;
   flex-direction: column;
   width: 100%;
-  height: calc(100% - 1px);
+  height: calc(100% - 2px);
 }
 
 .win-content {
@@ -611,7 +611,7 @@ tr:nth-child(even) {
 .chatlink {
   position: absolute;
   top: 5px;
-  right: 17px;
+  right: 20px;
   font-weight: bold;
   color: #4a4a49; 
   transition: font-size 0.2s;