Add comment

src/components/Apps/AppInfo.tsx

@@ -1,4 +1,3 @@
-import React, { useEffect, useMemo, useState } from 'react';
 import {
   AppCircle,
   AppCircleContainer,
@@ -172,7 +171,7 @@ export const AppInfo = ({ app, myName }) => {
               }}
             >
               <AppDownloadButtonText>
-                {isSelectedAppPinned
+                {isSelectedAppPinned // TODO translate
                   ? 'Unpin from dashboard'
                   : 'Pin to dashboard'}
               </AppDownloadButtonText>

src/components/Apps/AppInfoSnippet.tsx

@@ -166,7 +166,7 @@ export const AppInfoSnippet = ({
           sx={{
             backgroundColor: theme.palette.background.paper,
             opacity: isSelectedAppPinned ? 0.6 : 1,
-          }}
+          }} // TODO translate
         >
           <AppDownloadButtonText>
             {' '}

src/components/Apps/AppPublish.tsx

@@ -185,6 +185,7 @@ export const AppPublish = ({ names, categories }) => {
       const fee = await getFee('ARBITRARY');
 
       await show({
+        // TODO translate
         message: 'Would you like to publish this app?',
         publishFee: fee.fee + ' QORT',
       });

src/components/Apps/AppRating.tsx

@@ -106,6 +106,7 @@ export const AppRating = ({ app, myName, ratingCountPosition = 'right' }) => {
       const fee = await getFee('CREATE_POLL');
 
       await show({
+        // TODO translate
         message: `Would you like to rate this app a rating of ${newValue}?. It will create a POLL tx.`,
         publishFee: fee.fee + ' QORT',
       });

src/components/Apps/Apps-styles.tsx

@@ -351,7 +351,7 @@ export const PublishQAppChoseFile = styled(ButtonBase)(({ theme }) => ({
   justifyContent: 'center',
   width: '120px',
   '&:hover': {
-    backgroundColor: 'action.hover', // background on hover
+    backgroundColor: 'action.hover',
   },
 }));
 

src/components/Apps/AppsCategoryDesktop.tsx

@@ -16,20 +16,6 @@ import { Spacer } from '../../common/Spacer';
 import { AppInfoSnippet } from './AppInfoSnippet';
 import { Virtuoso } from 'react-virtuoso';
 
-const ScrollerStyled = styled('div')({
-  // Hide scrollbar for WebKit browsers (Chrome, Safari)
-  '::-webkit-scrollbar': {
-    width: '0px',
-    height: '0px',
-  },
-
-  // Hide scrollbar for Firefox
-  scrollbarWidth: 'none',
-
-  // Hide scrollbar for IE and older Edge
-  msOverflowStyle: 'none',
-});
-
 const StyledVirtuosoContainer = styled('div')({
   position: 'relative',
   width: '100%',
@@ -99,7 +85,8 @@ export const AppsCategoryDesktop = ({
   }, [debouncedValue, categoryList]);
 
   const rowRenderer = (index) => {
-    let app = searchedList[index];
+    const app = searchedList[index];
+
     return (
       <AppInfoSnippet
         key={`${app?.service}-${app?.name}`}
@@ -205,9 +192,6 @@ export const AppsCategoryDesktop = ({
               itemContent={rowRenderer}
               atBottomThreshold={50}
               followOutput="smooth"
-              // components={{
-              //   Scroller: ScrollerStyled, // Use the styled scroller component
-              // }}
             />
           </StyledVirtuosoContainer>
         </AppsWidthLimiter>

src/components/Apps/AppsDesktop.tsx

@@ -17,7 +17,6 @@ import { AppsCategoryDesktop } from './AppsCategoryDesktop';
 import { AppsNavBarDesktop } from './AppsNavBarDesktop';
 import { Box, ButtonBase, useTheme } from '@mui/material';
 import { HomeIcon } from '../../assets/Icons/HomeIcon';
-import { MessagingIcon } from '../../assets/Icons/MessagingIcon';
 import { Save } from '../Save/Save';
 import { IconWrapper } from '../Desktop/DesktopFooter';
 import { enabledDevModeAtom } from '../../atoms/global';
@@ -98,8 +97,6 @@ export const AppsDesktop = ({
       setCategories(responseData);
     } catch (error) {
       console.log(error);
-    } finally {
-      // dispatch(setIsLoadingGlobal(false))
     }
   }, []);
 
@@ -135,8 +132,6 @@ export const AppsDesktop = ({
       setAvailableQapps(combine);
     } catch (error) {
       console.log(error);
-    } finally {
-      // dispatch(setIsLoadingGlobal(false))
     }
   }, []);
   useEffect(() => {
@@ -338,13 +333,13 @@ export const AppsDesktop = ({
       <Box
         sx={{
           alignItems: 'center',
+          backgroundColor: theme.palette.background.surface,
+          borderRight: `1px solid ${theme.palette.border.subtle}`,
           display: 'flex',
           flexDirection: 'column',
           gap: '25px',
           height: '100vh',
           width: '60px',
-          backgroundColor: theme.palette.background.surface,
-          borderRight: `1px solid ${theme.palette.border.subtle}`,
         }}
       >
         <ButtonBase
@@ -407,6 +402,7 @@ export const AppsDesktop = ({
             />
           </IconWrapper>
         </ButtonBase>
+
         <Save isDesktop disableWidth myName={myName} />
         {isEnabledDevMode && (
           <ButtonBase
@@ -445,10 +441,10 @@ export const AppsDesktop = ({
         <Box
           sx={{
             display: 'flex',
-            width: '100%',
             flexDirection: 'column',
             height: '100vh',
             overflow: 'auto',
+            width: '100%',
           }}
         >
           <Spacer height="30px" />
@@ -515,6 +511,7 @@ export const AppsDesktop = ({
             }}
           >
             <Spacer height="30px" />
+
             <AppsHomeDesktop
               myName={myName}
               availableQapps={availableQapps}

src/components/Apps/AppsDevMode.tsx

@@ -310,7 +310,9 @@ export const AppsDevMode = ({
             />
           </IconWrapper>
         </ButtonBase>
+
         <Save isDesktop disableWidth myName={myName} />
+
         <ButtonBase
           onClick={() => {
             setDesktopViewMode('dev');
@@ -342,10 +344,10 @@ export const AppsDevMode = ({
         <Box
           sx={{
             display: 'flex',
-            width: '100%',
             flexDirection: 'column',
             height: '100vh',
             overflow: 'auto',
+            width: '100%',
           }}
         >
           <Spacer height="30px" />
@@ -387,6 +389,7 @@ export const AppsDevMode = ({
             }}
           >
             <Spacer height="30px" />
+
             <AppsDevModeHome
               myName={myName}
               availableQapps={availableQapps}

src/components/Apps/AppsDevModeNavBar.tsx

@@ -80,13 +80,13 @@ export const AppsDevModeNavBar = () => {
   return (
     <AppsNavBarParent
       sx={{
-        position: 'relative',
+        borderRadius: '0px 30px 30px 0px',
         flexDirection: 'column',
-        width: '59px',
         height: 'unset',
         maxHeight: '70vh',
-        borderRadius: '0px 30px 30px 0px',
         padding: '10px',
+        position: 'relative',
+        width: '59px',
       }}
     >
       <AppsNavBarLeft

src/components/Apps/AppsHomeDesktop.tsx

@@ -51,7 +51,7 @@ export const AppsHomeDesktop = ({
         <AppLibrarySubTitle
           sx={{
             fontSize: '30px',
-          }}
+          }} // TODO translate
         >
           Apps Dashboard
         </AppLibrarySubTitle>

src/components/Apps/AppsLibraryDesktop.tsx

@@ -273,7 +273,7 @@ export const AppsLibraryDesktop = ({
             }}
             onClick={() => {
               executeEvent('navigateBack', {});
-            }}
+            }} // TODO translate
           >
             <ReturnIcon />
             <ComposeP>Return to Apps Dashboard</ComposeP>