Merge pull request #154 from intri-in/flickerFix_QuickAddModal

Fixed #140
intri-in · Mar 2, 2024 · 0d82e11 · 0d82e11
2 parents 7b7c2d3 + 2266981
commit 0d82e11
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 80 deletions.
diff --git a/CHANGELOG b/CHANGELOG
@@ -12,7 +12,9 @@ v0.4.5
 - Fixed list of caldav accounts not updating after adding or deleting a caldav account.
 - Fixed Force sync button's function in /accounts/caldav page.
 - Logout now deletes the local dexie db for security.
-
+- Fixed #140
+ - Fixed flickering of Quick Add info modal.
+
 v0.4.4
 - Version bump to 0.4.4
 - Fixed bug #128

diff --git a/COMMITMESSAGE.md b/COMMITMESSAGE.md
@@ -1,6 +1,2 @@
-- Fixed #152
-    - Now Caldav registration is done via a POST request.
-- Fixed problems of duplication of calendars post adding a new CalDAV account.
-- Fixed list of caldav accounts not updating after adding or deleting a caldav account.
-- Fixed Force sync button's function in /accounts/caldav page.
-- Logout now deletes the local dexie db for security.
+Fixed #140
+ - Fixed flickering of Quick Add info modal.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -30,7 +30,7 @@
     "@mui/material": "5.11.13",
     "axios": "1.6.1",
     "bcryptjs": "2.4.3",
-    "bootstrap": "5.3.2",
+    "bootstrap": "5.3.3",
     "bootstrap-icons": "1.10.3",
     "crypto-js": "4.2.0",
     "dexie": "3.2.3",

diff --git a/src/components/common/AddTask/AddInfo.tsx b/src/components/common/AddTask/AddInfo.tsx
@@ -5,84 +5,86 @@ import Button from 'react-bootstrap/Button';
 import { getI18nObject } from '@/helpers/frontend/general';
 import { Col, Row } from 'react-bootstrap';
 import Link from 'next/link';
-
+const InformationModal = (props) => {
+  const i18next= getI18nObject()
+  return (
+    <Modal
+      {...props}
+      centered
+    >
+      <Modal.Header closeButton>
+        <Modal.Title id="contained-modal-title-vcenter">
+          {i18next.t("QUICK_ADD")}
+        </Modal.Title>
+      </Modal.Header>
+      <Modal.Body>
+          {i18next.t("QUICK_ADD_DESC1")}
+        <h2>{i18next.t("SHORTCUTS")}</h2>
+        <div style={{textAlign:"center"}}>
+        <Row>
+        <Col>
+        <b>{i18next.t("SYNTAX")}</b>
+        </Col>
+        <Col>
+        <b>{i18next.t("DESCRIPTION")}</b>
+        </Col>
+        </Row>
+        <Row >
+          <Col>
+            @:date
+          </Col>
+          <Col>
+          {i18next.t("QUICK_ADD_DATE_DESCRIPTION")}
+          </Col>
+        </Row>
+        <Row >
+          <Col>
+            !:priority
+          </Col>
+          <Col>
+          {i18next.t("QUICK_ADD_PRIORITY_DESCRIPTION")}
+          </Col>
+        </Row>
+        <Row >
+          <Col>
+          #:label
+          </Col>
+          <Col>
+          {i18next.t("QUICK_ADD_LABEL_DESCRIPTION")}
+          </Col>
+        </Row>
+        </div>
+        <br />
+        <Link href="https://manage-my-damn-life-nextjs.readthedocs.io/en/latest/Feature%20Guide/QuickAdd/" target='_blank'>{i18next.t("LEARN_MORE")}</Link>
+      </Modal.Body>
+      <Modal.Footer>
+        <Button onClick={props.onHide}>{i18next.t("CLOSE")}</Button>
+      </Modal.Footer>
+    </Modal>
+  );
+}
 type ChildProps = {
 }
 const AddInfo: FC<ChildProps> = () => {
   const [showModal, setShow]=useState(false)
+
   const onClickInfo = () =>{
     setShow(true)
   }
 
   const i18next= getI18nObject()
-  function InformationModal(props) {
-    return (
-      <Modal
-        {...props}
-        size="md"
-        centered
-      >
-        <Modal.Header closeButton>
-          <Modal.Title id="contained-modal-title-vcenter">
-            {i18next.t("QUICK_ADD")}
-          </Modal.Title>
-        </Modal.Header>
-        <Modal.Body>
-            {i18next.t("QUICK_ADD_DESC1")}
-          <h2>{i18next.t("SHORTCUTS")}</h2>
-          <div style={{textAlign:"center"}}>
-          <Row>
-          <Col>
-          <b>{i18next.t("SYNTAX")}</b>
-          </Col>
-          <Col>
-          <b>{i18next.t("DESCRIPTION")}</b>
-          </Col>
-          </Row>
-          <Row >
-            <Col>
-              @:date
-            </Col>
-            <Col>
-            {i18next.t("QUICK_ADD_DATE_DESCRIPTION")}
-            </Col>
-          </Row>
-          <Row >
-            <Col>
-              !:priority
-            </Col>
-            <Col>
-            {i18next.t("QUICK_ADD_PRIORITY_DESCRIPTION")}
-            </Col>
-          </Row>
-          <Row >
-            <Col>
-            #:label
-            </Col>
-            <Col>
-            {i18next.t("QUICK_ADD_LABEL_DESCRIPTION")}
-            </Col>
-          </Row>
-          </div>
-          <br />
-          <Link href="https://manage-my-damn-life-nextjs.readthedocs.io/en/latest/Feature%20Guide/QuickAdd/" target='_blank'>{i18next.t("LEARN_MORE")}</Link>
-        </Modal.Body>
-        <Modal.Footer>
-          <Button onClick={props.onHide}>{i18next.t("CLOSE")}</Button>
-        </Modal.Footer>
-      </Modal>
-    );
-  }
+
   return (
     <>
 
-       <div style={{display: "flex", justifyContent:"center", alignItems:"center", height:"100%"}}><MdInfo size={24} onClick={onClickInfo} />
+       <div style={{display: "flex", justifyContent:"center", alignItems:"center", height:"100%"}}>
+        <MdInfo size={24} onClick={onClickInfo} />
        <InformationModal
-      show={showModal}
-      onHide={() => setShow(false)}
-    />
+        show={showModal}
+        onHide={() => setShow(false)}
+      />
     </div>
-</>
+  </>
 
   )
 };

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -59,7 +59,7 @@ export default function HomePage() {
 
 
 
-    var finalOutput = (<CombinedView updated={updated} onSynComplete={onSynComplete} />)
+    let finalOutput = (<CombinedView updated={updated} onSynComplete={onSynComplete} />)
 
     return(
         <div   >