Merge pull request #733 from friendsofagape/Resource-Fix1

Updating resource loading code with lint fix

Author: vipinpaul

package-lock.json

@@ -47,22 +47,22 @@ export default function Buttons(props) {
   return (
     <>
       <RectangleStackIcon
-        aria-label='Collection-Icon'
+        aria-label="Collection-Icon"
         className={classNames(
           sectionable ? 'fill-current' : '',
           'h-5 mr-2 w-5 text-white cursor-pointer',
         )}
-        aria-hidden='true'
+        aria-hidden="true"
         onClick={onSectionable}
       />
 
       <PencilIcon
-        aria-label='Collection-Icon'
+        aria-label="Collection-Icon"
         className={classNames(
           editable ? 'fill-current' : '',
           'h-5 mr-2 w-5 text-white cursor-pointer',
         )}
-        aria-hidden='true'
+        aria-hidden="true"
         onClick={onEditable}
       />
 

renderer/src/components/EditorPage/Scribex/Buttons.jsx

@@ -1,5 +1,5 @@
 import React, {
-  useRef, Fragment, useContext, useState,
+  Fragment, useContext, useState,
 } from 'react';
 import PropTypes from 'prop-types';
 
@@ -13,9 +13,8 @@ import * as logger from '../../logger';
 import { viewBurrito } from '../../core/burrito/importBurrito';
 
 export default function ImportResource({
-  open, closePopUp, setOpenResourcePopUp, setLoading,
+  closePopUp, setOpenResourcePopUp, setLoading,
 }) {
-  const cancelButtonRef = useRef(null);
   const [valid, setValid] = useState(false);
   const [snackBar, setOpenSnackBar] = useState(false);
   const [snackText, setSnackText] = useState('');
@@ -66,7 +65,7 @@ export default function ImportResource({
         logger.debug('ImportResource.js', 'error in uploading resource to specified location');
         setNotify(err);
       });
-      setFolderPath('')
+      setFolderPath('');
   };
   const uploadRefBible = async () => {
     const fs = window.require('fs');
@@ -127,7 +126,7 @@ export default function ImportResource({
           name="location"
           id=""
           value={folderPath}
-          onChange={(e) => c(e.target.value)}
+          onChange={(e) => setFolderPath(e.target.value)}
           className="bg-white w-52 lg:w-80 block rounded shadow-sm sm:text-sm focus:border-primary border-gray-300"
         />
         <button
@@ -172,7 +171,6 @@ export default function ImportResource({
 }
 
 ImportResource.propTypes = {
-  open: PropTypes.bool,
   closePopUp: PropTypes.func,
   setOpenResourcePopUp: PropTypes.func,
   setLoading: PropTypes.func,

renderer/src/components/Resources/ImportResource.js

@@ -1,3 +1,5 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable jsx-a11y/control-has-associated-label */
 import {
   useEffect, useState, useContext,
 } from 'react';
@@ -6,7 +8,6 @@ import CheckHelpsUpdatePopUp from '@/components/Resources/ResourceUtils/CheckHel
 import RemoveResource from '@/components/Resources/ResourceUtils/RemoveResource';
 import { ArrowDownTrayIcon } from '@heroicons/react/24/solid';
 import { ProjectContext } from '@/components/context/ProjectContext';
-import { readResourceMetadata } from '@/components/Resources/ResourceUtils/readResourceMetadata';
 import * as logger from '../../logger';
 import LoadingScreen from '../Loading/LoadingScreen';
 
@@ -52,18 +53,16 @@ export const ListResources = ({
     createData('Spanish', 'es-419', 'es-419_gl'),
   ];
 
-
   const { t } = useTranslation();
-  const [offlineResources, setOfflineResources] = useState([]);
-  const [onlineResources, setOnlineResources] = useState();
+  // eslint-disable-next-line no-unused-vars
   const [translationWordList, settranslationWordList] = useState(translationWordLists);
   const [translationNote, setTranslationNote] = useState([]);
   const [translationQuestion, setTranslationQuestion] = useState([]);
   const [translationWord, settranslationWord] = useState([]);
   const [translationAcademy, setTranslationAcademy] = useState([]);
   const [obsTranslationNote, setObsTranslationNote] = useState([]);
   const [obsTranslationQuestion, setObsTranslationQuestion] = useState([]);
-
+  const [renderApp, setRenderApp] = useState(false);
   const handleDownloadHelpsResources = async (event, reference, offlineResource) => {
     if (!downloading) {
       try {
@@ -73,6 +72,7 @@ export const ListResources = ({
         setCurrentDownloading(null);
         setOpenSnackBar(true);
         setError('success');
+        setRenderApp(true);
         setSnackText('Resource Download Finished');
       } catch (err) {
         logger.debug('ResourcesPopUp.js', 'Error Downlaod ', err);
@@ -89,7 +89,7 @@ export const ListResources = ({
 
   useEffect(() => {
     (async () => {
-      setLoading(true)
+      setLoading(true);
       logger.debug('ResourcesPopUp.js', `get available selected resources ${selectResource}`);
       switch (selectResource) {
         case 'tn':
@@ -113,7 +113,7 @@ export const ListResources = ({
         default:
           break;
       }
-      setLoading(false)
+      setLoading(false);
     })();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [selectResource, selectedPreProd]);
@@ -139,8 +139,10 @@ export const ListResources = ({
 
   useEffect(() => { // LOADS locally available
     readLocalResources(username, setSubMenuItems);
-  }, []);
-  console.log(">>>>>>>>>>>>>>>>>>>>>",filteredResources?.onlineResource)
+    if (renderApp === true) {
+      setRenderApp(false);
+    }
+  }, [renderApp]);
 
   return (
     <div className="h-full">
@@ -231,6 +233,7 @@ export const ListResources = ({
                         <RemoveResource
                           resource={resource}
                           selectResource={selectResource}
+                          setRenderApp={setRenderApp}
                         />
                       </div>
                     </div>
@@ -323,4 +326,4 @@ export const ListResources = ({
         )}
     </div>
   );
-};
+};

renderer/src/components/Resources/ListResources.js

@@ -1,21 +1,25 @@
-import React, { useContext, useEffect,useReducer } from 'react';
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable no-nested-ternary */
+/* eslint-disable jsx-a11y/control-has-associated-label */
+import React, { useContext, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import RemoveResource from '@/components/Resources/ResourceUtils/RemoveResource';
 import CheckHelpsUpdatePopUp from '@/components/Resources/ResourceUtils/CheckHelpsUpdatePopUp';
 import { ProjectContext } from '@/components/context/ProjectContext';
 import readLocalResources from './useReadLocalResources';
+import LoadingScreen from '../Loading/LoadingScreen';
 
 export default function ObsBibleAudioTab({
   selectResource,
   filteredBibleObsAudio,
-  removeSection,
   handleRowSelect,
   setfilteredBibleObsAudio,
   loading,
   setSubMenuItems,
   subMenuItems,
 }) {
   const { t } = useTranslation();
+  const [renderApp, setRenderApp] = useState(false);
   const {
     states: {
       username,
@@ -26,11 +30,14 @@ export default function ObsBibleAudioTab({
     { resourceType: 'obs', flavorName: 'textStories' },
     { resourceType: 'audio', flavorName: 'audioTranslation' },
   ];
-  const currentResourceType = resourceMap.find((resourceItem) => resourceItem.resourceType == selectResource);
+  const currentResourceType = resourceMap.find((resourceItem) => resourceItem.resourceType === selectResource);
 
   useEffect(() => { // LOADS  locally available
     readLocalResources(username, setSubMenuItems);
-  }, []);
+    if (renderApp === true) {
+      setRenderApp(false);
+    }
+  }, [renderApp]);
 
   useEffect(() => {
     const resourceName = (selectResource === 'bible')
@@ -151,10 +158,14 @@ export default function ObsBibleAudioTab({
                                   && (
                                     <CheckHelpsUpdatePopUp resource={ref} selectResource={selectResource} />
                                   )}
-                                {selectResource !== 'audio' &&
-                                  <RemoveResource resource={ref}
+                                {selectResource !== 'audio'
+                                  && (
+                                  <RemoveResource
+                                    resource={ref}
                                     selectResource={selectResource}
-                                  />}
+                                    setRenderApp={setRenderApp}
+                                  />
+)}
                               </div>
                             </div>
                           </td>

renderer/src/components/Resources/ObsBibleAudioTab.js

@@ -24,7 +24,6 @@ export default function ResourceTabPane({
 }) {
   const [isOpenDonwloadPopUp, setIsOpenDonwloadPopUp] = useState(false);
   const [resourceIconClick, setResourceIconClick] = useState(false);
-  console.log({ selectResource });
   const openResourceDialogBox = () => {
     if (selectResource === 'bible' || selectResource === 'obs') {
       logger.debug('DownloadResourcePopUp.js', 'Calling bible resource pop up');
@@ -46,7 +45,7 @@ export default function ResourceTabPane({
           >
             {selectResource}
           </Tab>
-          {selectResource != 'audio'
+          {selectResource !== 'audio'
           && (
           <Tab as={Fragment}>
             {({ selected }) => (

renderer/src/components/Resources/ResourceTabPane.js

@@ -7,6 +7,7 @@ function CustomMultiComboBox({
 }) {
   let filteredData = [];
   const [query, setQuery] = useState('');
+  // eslint-disable-next-line no-unused-vars
   const [isActive, setIsActive] = useState(false);
   if (customData.length === 1) {
     setSelectedList(customData);
@@ -23,7 +24,7 @@ function CustomMultiComboBox({
       customData.length > 1 ? (
         <Combobox value={selectedList} onChange={setSelectedList} multiple>
           {({ open }) => (
-            <div className="relative">              
+            <div className="relative">
               <div className="relative w-full border border-gray-200 cursor-default overflow-hidden rounded-lg bg-white text-left shadow-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-opacity-75 focus-visible:ring-offset-2 focus-visible:ring-offset-teal-300 sm:text-sm">
 
                 <Combobox.Input

renderer/src/components/Resources/ResourceUtils/CustomMultiComboBox.js

@@ -1,3 +1,6 @@
+/* eslint-disable react/no-array-index-key */
+/* eslint-disable jsx-a11y/control-has-associated-label */
+/* eslint-disable no-unused-vars */
 /* eslint-disable react/jsx-key */
 /* eslint-disable no-nested-ternary */
 import React, { useEffect, useState } from 'react';
@@ -11,10 +14,10 @@ import { makeStyles } from '@material-ui/core/styles';
 import LoadingScreen from '@/components/Loading/LoadingScreen';
 import { XMarkIcon, ArrowDownTrayIcon } from '@heroicons/react/24/solid';
 import { AutographaContext } from '@/components/context/AutographaContext';
+import { TrashIcon } from '@heroicons/react/24/outline';
 import CustomMultiComboBox from './CustomMultiComboBox';
 import langJson from '../../../lib/lang/langNames.json';
 import { handleDownloadResources } from './createDownloadedResourceSB';
-import { TrashIcon } from '@heroicons/react/24/outline';
 import * as logger from '../../../logger';
 
 const subjectTypeArray = {

renderer/src/components/Resources/ResourceUtils/DownloadResourcePopUp.js

@@ -90,7 +90,7 @@ const ResourceResetAfterCheckSameOnRefResourceAgSettings = async (setResetResour
 };
 
 function RemoveResource({
-  resource, selectResource,
+  resource, selectResource, setRenderApp,
 }) {
     logger.warn('removeResource.js', 'inside remove resource');
     const { t } = useTranslation();
@@ -148,6 +148,7 @@ function RemoveResource({
               // read ag-settings of the project
               await ResourceResetAfterCheckSameOnRefResourceAgSettings(setResetResourceOnDeleteOffline, resource);
               // handleRowSelect(null, null, null, null, '');
+              setRenderApp(true);
               setOpenSnackBar(true);
               setNotify('success');
               setSnackText('Removed Resource Successfully');
@@ -193,7 +194,7 @@ function RemoveResource({
 RemoveResource.propTypes = {
     resource: PropTypes.object,
     selectResource: PropTypes.string,
-    closeResourceWindow: PropTypes.func,
+    setRenderApp: PropTypes.func,
   };
 
 export default RemoveResource;

renderer/src/components/Resources/ResourceUtils/RemoveResource.js

@@ -1,13 +1,14 @@
 import { readRefMeta } from '@/core/reference/readRefMeta';
 import { readRefBurrito } from '@/core/reference/readRefBurrito';
 import * as localforage from 'localforage';
+
 const path = require('path');
 
 export async function readResourceMetadata(projectsDir, resourcePath, setSubMenuItems, parseData) {
   const refs = await readRefMeta({ projectsDir });
   refs.forEach(async (ref) => {
-    const metaPath = path.join(`${resourcePath}` , ref, 'metadata.json')
-    const data = await readRefBurrito({ metaPath })
+    const metaPath = path.join(`${resourcePath}`, ref, 'metadata.json');
+    const data = await readRefBurrito({ metaPath });
     if (data) {
       const burrito = {};
       burrito.projectDir = ref;