convert-pdf-rtl

src/Components/ConvertToPdf.jsx

@@ -1,13 +1,19 @@
 import html2pdf from 'html2pdf.js';
 import { HiOutlineDownload } from 'react-icons/hi';
 import { Tooltip } from 'react-tooltip';
+
 function ConvertToPdf(props) {
   const text = props.text;
-
+  const language = props.languege;
+  console.log(language);
   function convertPdf() {
     // Create a new div element to hold the text content
     const contentDiv = document.createElement('div');
-
+    console.log(language == 'Hebrew');
+    if (language == 'Hebrew')
+      {contentDiv.style.direction = 'rtl'; // Set text direction to RTL for Hebrew
+      console.log("if");  
+      }
     // Loop through the characters in the text array
     text.forEach((charInfo) => {
       const charElement = document.createElement('span');
@@ -44,7 +50,7 @@ function ConvertToPdf(props) {
   return (
     <div className="Convert_To_Pdf" id="Convert_To_Pdf" data-tooltip-id="Convert-to-PDF" data-tooltip-content="Convert to PDF">
       <button onClick={convertPdf}><HiOutlineDownload></HiOutlineDownload></button>
-      <Tooltip id="Convert-to-PDF" className= 'common-tooltip' />
+      <Tooltip id="Convert-to-PDF" className='common-tooltip' />
     </div>
   );
 }

src/Components/SpecialButtons.jsx

@@ -10,15 +10,15 @@ import ConvertToPdf from "./ConvertToPdf";
 import { Tooltip } from 'react-tooltip';
 
 
-function SpecialButtons({ handleEvent, isUndo, isRedo,text }) {
+function SpecialButtons({ handleEvent, isUndo, isRedo,languege,text }) {
   const notify = () => {
     toast("Text is copied to clipboard!");
     handleEvent("copy");
   };
 
   return (
     <div id="spacial_buttons" className="spacial_buttons">
-      <ConvertToPdf text={text}></ConvertToPdf>
+      <ConvertToPdf text={text} languege={languege}></ConvertToPdf>
       <Popup
         trigger={
           <button className="button" data-tooltip-id="delete-tooltip" data-tooltip-content="Delete All" >

src/Components/virtualKeyBoard.jsx

@@ -146,8 +146,15 @@ const reducer = (state, action) => {
 };
 function VirtualKeyBoard() {
     const [state, dispatch] = useReducer(reducer, initialState);
-    const { iso_639_2, language, keyList, placeholder, currentStyle, stack, emojiActive, isUndo, isRedo, redoStack } = state;
+    const { iso_639_2, languageName, keyList, placeholder, currentStyle, stack, emojiActive, isUndo, isRedo, redoStack } = state;
     const [isShift, setisShift] = useState(false);
+
+    const [language, setLanguage] = useState(languageName);
+
+    useEffect(() => {
+        setLanguage(languageName);
+        console.log("Current language:", languageName);
+    }, [languageName]);
     const setCurrentStyle = (newStyle) => {
         dispatch({
             type: "updateCurrentStyle",
@@ -351,6 +358,7 @@ function VirtualKeyBoard() {
                     handleEvent={handleEvent}
                     isUndo={isUndo}
                     isRedo={isRedo}
+                    languege=  {language}  
                     text={ stack.length && stack[stack.length - 1].length
                         ? stack[stack.length - 1]
                         : placeholder}