ufsm book preview in the dialog modal after parsing

UI/.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+.env.local

UI/README.md

@@ -265,3 +265,50 @@ Key Highlights and Recommendations:
 - Implement proper authentication flows
 
 Would you like me to elaborate on any specific aspect of the project setup or discuss more detailed implementation strategies for Gitea integration?
+
+
+## To run the project using docker
+Ensure `.env` file is created in the docker folder with following variables.
+   ```bash
+    VITE_GITEA_BASE_URL=http://localhost:3000
+    VITE_GITEA_UI_URL=http://localhost:3001
+    VITE_GITEA_ORG_NAME=BCS
+    VITE_GITEA_CLIENT_ID = {your-client-id}
+    VITE_GITEA_CLIENT_SECRET = {your-client-secret}
+    VITE_GITEA_REDIRECT_URI=http://localhost:3001/oauth/callback
+    VITE_FASTAPI_BASE_URL=http://localhost:8000
+
+   ```
+
+From the `cd ai_mft_data_preprocessing/docker` folder:
+
+   ```bash
+    docker-compose up --build
+   ```
+
+To run the containers in detached mode
+
+   ```bash
+    docker-compose up --build -d
+   ```
+
+To check logs from your running Docker containers:
+
+   ```bash
+   docker logs <container_name>
+   ```
+
+To stop the App
+
+   ```bash
+   docker-compose down
+
+   ```
+If you get cors error while calling api ,add the following lines in the docker/gitea/gitea/conf/app.ini
+
+  ```bash
+   [cors]
+    ENABLED         = true
+    ALLOW_DOMAIN    = *
+
+   ```

UI/src/pages/ViewFile.tsx

@@ -53,8 +53,10 @@ export const ViewFile: React.FC = () => {
       : (fileContent.size / 1024).toFixed(2) + " KB";
 
   // Determine whether "Copy" and "Lines" are enabled
-  const isCopyEnabled = ["txt", "md", "usfm", "csv"].includes(fileExtension);
-  const isLineEnabled = ["txt", "pdf", "md", "usfm", "csv"].includes(
+  const isCopyEnabled = ["txt", "md", "usfm", "sfm", "csv"].includes(
+    fileExtension
+  );
+  const isLineEnabled = ["txt", "pdf", "md", "usfm", "sfm", "csv"].includes(
     fileExtension
   );
   const isDownloadEnabled = ["pdf"].includes(fileExtension);
@@ -187,10 +189,13 @@ export const ViewFile: React.FC = () => {
         <TextViewer
           content={decodedContent}
           isMarkdown={true}
+          fileName={fileName}
+          filePath={fileContent.path}
+          sha={fileContent.sha}
           isPreviewMode={isPreviewMode}
         />
       );
-    } else if (["txt", "usfm", "json"].includes(fileExtension)) {
+    } else if (["txt", "usfm", "sfm", "json"].includes(fileExtension)) {
       return (
         <TextViewer
           content={decodedContent}

UI/src/pages/data-preprocessing/ParallelCorpora.tsx

@@ -111,12 +111,12 @@ const ParallelCorpora: React.FC = () => {
         const bibles = response?.data?.bibles || [];
 
         // Calculate the total successful books across all bibles
-        const successfulBooksCount = bibles.reduce((total, bible) => {
+        const successfulBooksCount = bibles.reduce((total: any, bible: any) => {
           // Check if bible has books array
           if (bible.books && Array.isArray(bible.books)) {
             // Count only the books with status "success"
             const successfulBooks = bible.books.filter(
-              (book) => book.status === "success"
+              (book: any) => book.status === "success"
             );
             return total + successfulBooks.length;
           }
@@ -133,10 +133,10 @@ const ParallelCorpora: React.FC = () => {
         // Same logic for repo2
         const bibles = response?.data?.bibles || [];
 
-        const successfulBooksCount = bibles.reduce((total, bible) => {
+        const successfulBooksCount = bibles.reduce((total: any, bible: any) => {
           if (bible.books && Array.isArray(bible.books)) {
             const successfulBooks = bible.books.filter(
-              (book) => book.status === "success"
+              (book: any) => book.status === "success"
             );
             return total + successfulBooks.length;
           }
@@ -175,8 +175,8 @@ const ParallelCorpora: React.FC = () => {
     try {
       // Determine which API endpoint to use based on withBCV
       const apiEndpoint = withBCV
-        ? `${import.meta.env.VITE_FASTAPI_BASE_URL}/parallel_corpora/withbcv/csv/`
-        : `${import.meta.env.VITE_FASTAPI_BASE_URL}/parallel_corpora/withoutbcv/csv/`;
+        ? `${import.meta.env.VITE_FASTAPI_BASE_URL}/parallel_corpora/withbcv/`
+        : `${import.meta.env.VITE_FASTAPI_BASE_URL}/parallel_corpora/withoutbcv/`;
 
       // Make the API call
       const response = await axios.get(apiEndpoint, {
@@ -193,12 +193,14 @@ const ParallelCorpora: React.FC = () => {
       // Create a link element and trigger download
       const link = document.createElement("a");
       link.href = window.URL.createObjectURL(blob);
-      const fileName = withBCV ? `parallel_corpora_BCV_${selectedProject1}_${selectedProject2}.csv`: `parallel_corpora_${selectedProject1}_${selectedProject2}.csv`;
+      const fileName = withBCV
+        ? `parallel_corpora_BCV_${selectedProject1}_${selectedProject2}.csv`
+        : `parallel_corpora_${selectedProject1}_${selectedProject2}.csv`;
       link.download = fileName;
       document.body.appendChild(link);
       link.click();
       document.body.removeChild(link);
-    } catch (error) {
+    } catch (error: any) {
       console.error("Error downloading CSV:", error);
       toast({
         variant: "destructive",
@@ -252,7 +254,7 @@ const ParallelCorpora: React.FC = () => {
                   handleSelectValueChange("repo2", value)
                 }
                 options={projects.filter(
-                  (project) => project.name !== selectedProject1
+                  (project: any) => project.name !== selectedProject1
                 )}
                 placeholder="Select target project"
               />