Merge pull request #1969 from Gauravjeetsingh/minor-issues

Bug fixes and improvements
KhalisFoundation · Jun 13, 2024 · 16b83d3 · 16b83d3
2 parents 6fad759 + 8bc484e
commit 16b83d3
Show file tree

Hide file tree

Showing 19 changed files with 198 additions and 130 deletions.
diff --git a/www/configs/navigator-settings.json b/www/configs/navigator-settings.json
@@ -75,5 +75,7 @@
     "homeVerse": false,
     "content":"",
     "baniType": ""
-  }
+  },
+
+  "disabledContent": []
 }
diff --git a/www/main/common/sttm-ui/tile/Tile.jsx b/www/main/common/sttm-ui/tile/Tile.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import { joinClasses } from '../../utils';
+import { classNames, joinClasses } from '../../utils';
 
 const Tile = ({
   children,
@@ -32,7 +32,7 @@ const Tile = ({
       className={`ui-tile ${tileClassname}`}
       style={theme ? getThemeSwatchStyles(theme) : null}
     >
-      <span className={isEngTransliterated && 'eng-tile'}>{children || content}</span>
+      <span className={classNames(isEngTransliterated && 'eng-tile')}>{children || content}</span>
     </button>
   );
 };

diff --git a/www/main/navigator/Navigator.jsx b/www/main/navigator/Navigator.jsx
@@ -13,9 +13,9 @@ const remote = require('@electron/remote');
 const { i18n } = remote.require('./app');
 
 const Navigator = () => {
-  const { minimizedBySingleDisplay, currentWorkspace } = useStoreState(
-    (state) => state.userSettings,
-  );
+  const { currentWorkspace } = useStoreState((state) => state.userSettings);
+
+  const { minimizedBySingleDisplay } = useStoreState((state) => state.navigator);
 
   const {
     displayWaheguruSlide,

diff --git a/www/main/navigator/search/hooks/use-new-shabad.jsx b/www/main/navigator/search/hooks/use-new-shabad.jsx
@@ -20,7 +20,7 @@ export const useNewShabad = () => {
     pane3,
   } = useStoreState((state) => state.navigator);
 
-  const { currentWorkspace } = useStoreState((state) => state.userSettings);
+  const { currentWorkspace, defaultPaneId } = useStoreState((state) => state.userSettings);
 
   const {
     setActiveShabadId,
@@ -38,8 +38,21 @@ export const useNewShabad = () => {
   } = useStoreActions((actions) => actions.navigator);
 
   return (newSelectedShabad, newSelectedVerse, newSearchVerse, multiPaneId = false) => {
+    let shabadPane;
     if (currentWorkspace === i18n.t('WORKSPACES.MULTI_PANE')) {
-      switch (multiPaneId) {
+      if (!multiPaneId) {
+        const existingPane = [pane1, pane2, pane3].filter(
+          (pane) => pane.activeShabad === newSelectedShabad,
+        );
+        if (existingPane.length > 0) {
+          [shabadPane] = existingPane;
+        } else {
+          shabadPane = defaultPaneId;
+        }
+      } else {
+        shabadPane = multiPaneId;
+      }
+      switch (shabadPane) {
         case 1:
           setPane1({
             ...pane1,
@@ -95,6 +108,17 @@ export const useNewShabad = () => {
     if (activeShabadId !== newSelectedShabad) {
       if (currentWorkspace !== i18n.t('WORKSPACES.MULTI_PANE')) {
         setActiveShabadId(newSelectedShabad);
+        if (window.socket !== undefined && window.socket !== null) {
+          window.socket.emit('data', {
+            type: 'shabad',
+            host: 'sttm-desktop',
+            id: newSelectedShabad,
+            shabadid: newSelectedShabad, // @deprecated
+            highlight: newSelectedVerse,
+            homeId: newSelectedVerse,
+            verseChange: false,
+          });
+        }
       }
 
       // initialVerseId is the verse which is stored in history
@@ -111,16 +135,5 @@ export const useNewShabad = () => {
     if (newSelectedVerse && activeVerseId !== newSelectedVerse) {
       setActiveVerseId(newSelectedVerse);
     }
-    if (window.socket !== undefined && window.socket !== null) {
-      window.socket.emit('data', {
-        type: 'shabad',
-        host: 'sttm-desktop',
-        id: newSelectedShabad,
-        shabadid: newSelectedShabad, // @deprecated
-        highlight: newSelectedVerse,
-        homeId: newSelectedVerse,
-        verseChange: false,
-      });
-    }
   };
 };
diff --git a/www/main/navigator/shabad/ShabadContent.jsx b/www/main/navigator/shabad/ShabadContent.jsx
@@ -373,7 +373,11 @@ const ShabadContent = () => {
     setTimeout(() => {
       const currentIndex = activeShabad.findIndex((obj) => obj.ID === activeVerseId);
       // Ignoring flower verse to avoid unwanted scroll during asa di vaar
-      if (activeVerseId !== 61 && activeShabad[currentIndex].Gurmukhi !== ',') {
+      if (
+        currentIndex >= 0 &&
+        activeVerseId !== 61 &&
+        activeShabad[currentIndex].Gurmukhi !== ','
+      ) {
         virtuosoRef.current.scrollToIndex({
           index: currentIndex,
           behavior: 'smooth',

diff --git a/www/main/navigator/shabad/ShabadText.jsx b/www/main/navigator/shabad/ShabadText.jsx
@@ -9,15 +9,15 @@ import { ShabadVerse } from '../../common/sttm-ui';
 import {
   changeHomeVerse,
   changeVerse,
-  sendToBaniController,
   filterRequiredVerseItems,
+  filterOverlayVerseItems,
   udpateHistory,
   scrollToVerse,
   saveToHistory,
   copyToClipboard,
   intelligentNextVerse,
+  sendToBaniController,
 } from './utils';
-import { filterOverlayVerseItems } from './utils/filter-verse-items';
 
 const baniLengthCols = {
   short: 'existsSGPC',
@@ -33,11 +33,15 @@ export const ShabadText = ({
   setPaneAttributes,
   currentPane,
 }) => {
+  const [previousVerseIndex, setPreviousIndex] = useState();
   const [filteredItems, setFilteredItems] = useState([]);
+  const [activeVerse, setActiveVerse] = useState({});
   const [rawVerses, setRawVerses] = useState([]);
-  const [previousVerseIndex, setPreviousIndex] = useState();
   const [atHome, setHome] = useState(true);
 
+  const virtuosoRef = useRef(null);
+  const activeVerseRef = useRef(null);
+
   const {
     activeVerseId,
     isMiscSlide,
@@ -67,13 +71,10 @@ export const ShabadText = ({
     setCeremonyId,
     setIsCeremonyBani,
     setIsSundarGutkaBani,
+    savedCrossPlatformId,
   } = useStoreActions((actions) => actions.navigator);
-  const [activeVerse, setActiveVerse] = useState({});
 
-  const virtuosoRef = useRef(null);
-  const activeVerseRef = useRef(null);
-
-  const updateTraversedVerse = (newTraversedVerse, verseIndex, crossPlatformID = null) => {
+  const updateTraversedVerse = (newTraversedVerse, verseIndex, crossPlatformId = null) => {
     if (isMiscSlide) {
       setIsMiscSlide(false);
     }
@@ -103,7 +104,7 @@ export const ShabadText = ({
       setPaneAttributes,
       paneAttributes,
     });
-    sendToBaniController(crossPlatformID, filteredItems, newTraversedVerse, baniLength, {
+    sendToBaniController(crossPlatformId, filteredItems, newTraversedVerse, baniLength, {
       isSundarGutkaBani,
       sundarGutkaBaniId,
       isCeremonyBani,
@@ -184,6 +185,15 @@ export const ShabadText = ({
     }
   }, [filteredItems]);
 
+  useEffect(() => {
+    const baniVerseIndex = filteredItems.findIndex(
+      (obj) => obj.crossPlatformId === savedCrossPlatformId,
+    );
+    if (baniVerseIndex >= 0) {
+      updateTraversedVerse(filteredItems[baniVerseIndex].ID, baniVerseIndex);
+    }
+  }, [savedCrossPlatformId]);
+
   useEffect(() => {
     const overlayVerse = filterOverlayVerseItems(rawVerses, activeVerseId);
     ipcRenderer.send(
@@ -193,7 +203,16 @@ export const ShabadText = ({
         live: liveFeed,
       }),
     );
-  }, [activeShabadId, activeVerseId]);
+    if ([activeShabadId, sundarGutkaBaniId, ceremonyId].includes(paneAttributes.activeShabad)) {
+      setPaneAttributes({
+        ...paneAttributes,
+        activeVerse: activeVerseId,
+      });
+      const verseIndex = filteredItems.findIndex((verse) => verse.verseId === activeVerseId);
+      if (verseIndex >= 0) setActiveVerse({ [verseIndex]: activeVerseId });
+      scrollToVerse(activeVerseId, filteredItems, virtuosoRef);
+    }
+  }, [activeShabadId, activeVerseId, sundarGutkaBaniId, ceremonyId]);
 
   const getVerse = (direction) => {
     let verseIndex = null;

diff --git a/www/main/navigator/shabad/utils/change-verse.js b/www/main/navigator/shabad/utils/change-verse.js
@@ -59,11 +59,11 @@ export const changeVerse = (
       setPreviousIndex(null);
     }
 
-    if (!isSundarGutkaBani) {
-      setIsSundarGutkaBani(true);
+    if (isSundarGutkaBani) {
+      setIsSundarGutkaBani(false);
     }
-    if (isCeremonyBani) {
-      setIsCeremonyBani(false);
+    if (!isCeremonyBani) {
+      setIsCeremonyBani(true);
     }
   } else if (baniType === 'shabad') {
     if (clickedShabad !== activeShabadId) {
@@ -100,34 +100,34 @@ export const sendToBaniController = (
   if (window.socket !== undefined && window.socket !== null) {
     let baniVerse;
     if (!crossPlatformId) {
-      baniVerse = activeShabad.find((obj) => obj.ID === newTraversedVerse);
+      baniVerse = activeShabad.find((obj) => obj.verseId === newTraversedVerse);
     }
-    if (isSundarGutkaBani) {
+    if (isSundarGutkaBani && sundarGutkaBaniId) {
       window.socket.emit('data', {
         host: 'sttm-desktop',
         type: 'bani',
-        id: sundarGutkaBaniId,
-        shabadid: sundarGutkaBaniId, // @deprecated
-        highlight: crossPlatformId || baniVerse.crossPlatformID,
+        id: paneAttributes.activeShabad,
+        shabadid: paneAttributes.activeShabad, // @deprecated
+        highlight: crossPlatformId || baniVerse.crossPlatformId,
         baniLength,
         // mangalPosition,
         verseChange: false,
       });
-    } else if (isCeremonyBani) {
+    } else if (isCeremonyBani && ceremonyId) {
       window.socket.emit('data', {
         host: 'sttm-desktop',
         type: 'ceremony',
-        id: ceremonyId,
-        shabadid: ceremonyId, // @deprecated
-        highlight: crossPlatformId || baniVerse.crossPlatformID,
+        id: paneAttributes.activeShabad,
+        shabadid: paneAttributes.activeShabad, // @deprecated
+        highlight: crossPlatformId || baniVerse.crossPlatformId,
         verseChange: false,
       });
-    } else {
+    } else if (activeShabadId) {
       window.socket.emit('data', {
         type: 'shabad',
         host: 'sttm-desktop',
-        id: activeShabadId,
-        shabadid: activeShabadId, // @deprecated
+        id: paneAttributes.activeShabad,
+        shabadid: paneAttributes.activeShabad, // @deprecated
         highlight: newTraversedVerse,
         homeId: paneAttributes.homeVerse,
         verseChange: false,

diff --git a/www/main/navigator/shabad/utils/index.js b/www/main/navigator/shabad/utils/index.js
@@ -4,7 +4,7 @@ export {
   udpateHistory,
   intelligentNextVerse,
 } from './change-verse';
-export { filterRequiredVerseItems } from './filter-verse-items';
+export { filterRequiredVerseItems, filterOverlayVerseItems } from './filter-verse-items';
 export { changeHomeVerse } from './change-home-verse';
 export { scrollToVerse } from './scroll-to-verse';
 export { saveToHistory } from './save-to-history';

diff --git a/www/main/settings/components/Categories.jsx b/www/main/settings/components/Categories.jsx
@@ -28,6 +28,7 @@ const SettingsFactory = ({ subCategory }) => {
       addonObj.forEach((add, index) => {
         addonMarkup.push(
           <Setting
+            key={`setting-addon-${index}`}
             settingObj={add}
             stateVar={convertToCamelCase(addon[index])}
             stateFunction={`set${convertToCamelCase(addon[index], true)}`}

diff --git a/www/main/settings/components/Setting.jsx b/www/main/settings/components/Setting.jsx
@@ -16,6 +16,8 @@ const Setting = ({ settingObj, stateVar, stateFunction }) => {
   const userSettings = useStoreState((state) => state.userSettings);
   const userSettingsActions = useStoreActions((state) => state.userSettings);
 
+  const { disabledContent } = useStoreState((state) => state.navigator);
+
   const handleInputChange = (event) => {
     const value = event.target ? event.target.value : event;
     const { disableSetting } = settingObj;
@@ -129,7 +131,11 @@ const Setting = ({ settingObj, stateVar, stateFunction }) => {
             {options.map((optionObj, optionIndex) => (
               <optgroup key={`option-${optionIndex}`} label={dropdownLabel(optionObj.label)}>
                 {optionObj.options.map((optionName, nameIndex) => (
-                  <option key={`option-name-${nameIndex}`} value={optionName.id}>
+                  <option
+                    key={`option-name-${nameIndex}`}
+                    value={optionName.id}
+                    disabled={disabledContent.includes(optionName.id)}
+                  >
                     {optionName.text}
                   </option>
                 ))}