From e45daaa43ff1e2157f79b1cb5eb8e164592c7667 Mon Sep 17 00:00:00 2001
From: gurjit03 <gurjitmehta@gmail.com>
Date: Sun, 22 Dec 2024 01:11:36 +0530
Subject: [PATCH 1/2] chore: created padding tools component

---
 www/main/viewer/Slide/PaddingTools.jsx | 30 ++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 www/main/viewer/Slide/PaddingTools.jsx

diff --git a/www/main/viewer/Slide/PaddingTools.jsx b/www/main/viewer/Slide/PaddingTools.jsx
new file mode 100644
index 00000000..e09cb74a
--- /dev/null
+++ b/www/main/viewer/Slide/PaddingTools.jsx
@@ -0,0 +1,30 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+
+const PaddingTools = (props) => {
+    const [paddingToolsOpen, setPaddingToolsOpen] = useState(false);
+    return (
+        <div className={`slide-quicktools ${!userSettings.quickTools ? 'hide-quicktools' : ''}`.trim()}>
+            <div className="quicktool-header" onClick={() => setPaddingToolsOpen(!paddingToolsOpen)}>
+                Padding Tools
+                <i className={`fa fa-caret-${quickToolsOpen ? 'up' : 'down'}`}></i>
+            </div>
+            {paddingToolsOpen && (
+                <div className={`quicktool-body quicktool-${isMiscSlide ? 'announcement' : 'gurbani'}`}>
+                {baniOrder.map((order, index) => (
+                    <div key={`item-${index}`} className="quicktool-item">
+                    {handleQuickTools(order, index)}
+                    <div className="quicktool-icons">{bakeIcons(order, index, quickToolsModifiers)}</div>
+                    </div>
+                ))}
+                </div>
+            )}
+        </div>
+    )   
+}
+
+PaddingTools.propTypes = {
+    isMiscSlide: PropTypes.bool
+}
+
+export default PaddingTools;
\ No newline at end of file

From f710556e567d1e6dcf125b9f18460480892f644d Mon Sep 17 00:00:00 2001
From: gurjit03 <gurjitmehta@gmail.com>
Date: Sun, 22 Dec 2024 01:11:57 +0530
Subject: [PATCH 2/2] chore: adds padding tools state

---
 www/main/viewer/store/ViewerState.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/www/main/viewer/store/ViewerState.js b/www/main/viewer/store/ViewerState.js
index 8b2e7464..d0108db5 100644
--- a/www/main/viewer/store/ViewerState.js
+++ b/www/main/viewer/store/ViewerState.js
@@ -30,6 +30,7 @@ const ViewerState = createStore({
   },
   viewerSettings: {
     quickToolsOpen: false,
+    paddingToolsOpen: false,
     slideOrder: ['translation', 'teeka', 'transliteration'],
     setSlideOrder: action((state, slideOrder) => ({
       ...state,
@@ -37,9 +38,16 @@ const ViewerState = createStore({
     })),
     setQuickToolsOpen: action((state, payload) => {
       const newState = state;
+      newState.paddingToolsOpen = false; // explictely making sure we are closing the paddingTools when setting the quick tools.
       newState.quickToolsOpen = payload;
       return newState;
     }),
+    setPaddingToolsOpen: action((state, payload) => {
+      const newState = state;
+      newState.quickToolsOpen = false; // explictely making sure we are closing the quickTools when setting the padding tools.
+      newState.paddingToolsOpen = payload;
+      return newState;
+    }),
   },
 });