rtl support for merge conflcit ui

bible-technology · Sep 28, 2023 · ed5b93c · ed5b93c
1 parent 6e1f10e
commit ed5b93c
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/renderer/src/layouts/projects/Import/ConflictEditor.jsx b/renderer/src/layouts/projects/Import/ConflictEditor.jsx
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import ConflictSection from './ConflictSection';
 
 function ConflictEditor({
-  selectedFileContent, setSelectedFileContent, selectedFileName, FileContentOrginal, setEnableSave, resolvedFileNames,
+  selectedFileContent, setSelectedFileContent, selectedFileName, FileContentOrginal, setEnableSave, resolvedFileNames, conflictData,
 }) {
   const [resolveAllActive, setResolveALlActive] = useState();
   const [resetAlll, setResetAll] = useState();
@@ -166,14 +166,23 @@ function ConflictEditor({
       {/* Content */}
       <div className="divide-y divide-gray-100 max-h-[71vh] overflow-y-scroll scrollbars-width">
         {selectedFileContent.map((content, index) => (
-          <div key={content.id} className="flex px-2 py-6 gap-4">
+          <div
+            key={content.id}
+            className={`flex px-2 py-6 gap-4
+            ${conflictData.data.incomingMeta.languages[0].scriptDirection?.toLowerCase() === 'rtl' ? 'flex-row-reverse' : 'flex-row'}`}
+          >
             {(index !== 0 && index !== selectedFileContent.length - 1) && (
               <div className="h-4 w-4 py-1 px-2 mt-1 flex items-center justify-center bg-primary rounded-full text-xxs text-white">
                 {index}
               </div>
             )}
 
-            <div className={` w-full ${(index === 0 || index === selectedFileContent.length - 1) && 'ml-8'} `}>
+            <div
+              className={` w-full ${(index === 0 || index === selectedFileContent.length - 1) && 'ml-8'}`}
+              style={{
+                direction: `${conflictData.data.incomingMeta.languages[0].scriptDirection?.toLowerCase() === 'rtl' ? 'rtl' : 'auto'}`,
+              }}
+            >
               <ConflictSection
                 text={
                     content?.title

diff --git a/renderer/src/layouts/projects/Import/ConflictResolverUI.jsx b/renderer/src/layouts/projects/Import/ConflictResolverUI.jsx
@@ -177,6 +177,7 @@ function ConflictResolverUI({ conflictData, setConflictPopup }) {
                   FileContentOrginal={FileContentOrginal}
                   setEnableSave={setEnableSave}
                   resolvedFileNames={resolvedFileNames}
+                  conflictData={conflictData}
                 />
                 <div className="h-[6vh] w-full flex justify-end items-center pr-10 gap-5">
                   {conflictData?.data?.files?.filepaths?.length === resolvedFileNames?.length && (