From 484835a89d5b77bfe64617560e190e3cb3622806 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 12:22:42 +0300 Subject: [PATCH 1/7] [SPT-526] fixed scalling page on open dropdowns menu --- src/components/common/StyledDropdown/index.js | 1 + src/components/common/StyledMenu/index.js | 8 +++++++- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/src/components/common/StyledDropdown/index.js b/src/components/common/StyledDropdown/index.js index 464c6f7a2..6735b999a 100644 --- a/src/components/common/StyledDropdown/index.js +++ b/src/components/common/StyledDropdown/index.js @@ -20,6 +20,7 @@ const StyledDropdown = ({ labelTxt, name, list, value, onChange, formControlProp value={value || ""} onChange={onChange} name={name} + MenuProps={{ disableScrollLock: true }} variant="outlined" disabled={disabled} className={classes.selectEmpty} diff --git a/src/components/common/StyledMenu/index.js b/src/components/common/StyledMenu/index.js index 273fe55dd..e5cc90de5 100644 --- a/src/components/common/StyledMenu/index.js +++ b/src/components/common/StyledMenu/index.js @@ -25,7 +25,13 @@ const StyledMenu = ({ classes, label, list }) => { - + {list.map((item) => ( From 435927a56f6e73bdfe95e5a8d871743f0b8bccc2 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 13:21:07 +0300 Subject: [PATCH 2/7] [SPT-518] fixed lint errors and improve perfomance --- src/App.js | 2 +- .../UserProfile/UserProfileAccount/index.js | 37 +++++----- src/components/UserProfile/index.js | 73 +++++++++++-------- 3 files changed, 62 insertions(+), 50 deletions(-) diff --git a/src/App.js b/src/App.js index c0ea588b0..2216e0ed9 100644 --- a/src/App.js +++ b/src/App.js @@ -57,7 +57,7 @@ const App = () => { useEffect(() => { dispatch(userActions.fetchUserDetails()); - }, []); + }, [dispatch]); if (!isInitialized) { return ( diff --git a/src/components/UserProfile/UserProfileAccount/index.js b/src/components/UserProfile/UserProfileAccount/index.js index 748c18636..d09b67604 100644 --- a/src/components/UserProfile/UserProfileAccount/index.js +++ b/src/components/UserProfile/UserProfileAccount/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useCallback, useEffect, useState } from "react"; import { useDispatch } from "react-redux"; import Grid from "@mui/material/Grid"; import { withStyles } from "@mui/styles"; @@ -36,18 +36,21 @@ const UserProfileAccount = ({ classes }) => { return { value: address, label: `${type} (${address})`, address, type }; }; - const getWallets = async (currentAddress) => { - const availableWallets = await dispatch(fetchAvailableUserWallets()); - let currentWallet = availableWallets.find(({ address }) => address === currentAddress); - const enhancedWallets = availableWallets.map(({ address, type }) => parseWallet(address, type)); - if (!currentWallet) { - currentWallet = parseWallet(currentAddress, walletTypes.METAMASK); - enhancedWallets.push(currentWallet); - } - setSelectedWallet(parseWallet(currentWallet.address, currentWallet.type)); - dispatch(userActions.updateWallet(currentWallet)); - return enhancedWallets; - }; + const getWallets = useCallback( + async (currentAddress) => { + const availableWallets = await dispatch(fetchAvailableUserWallets()); + let currentWallet = availableWallets.find(({ address }) => address === currentAddress); + const enhancedWallets = availableWallets.map(({ address, type }) => parseWallet(address, type)); + if (!currentWallet) { + currentWallet = parseWallet(currentAddress, walletTypes.METAMASK); + enhancedWallets.push(currentWallet); + } + setSelectedWallet(parseWallet(currentWallet.address, currentWallet.type)); + dispatch(userActions.updateWallet(currentWallet)); + return enhancedWallets; + }, + [dispatch] + ); useEffect(() => { const fetchWallets = async () => { @@ -66,7 +69,8 @@ const UserProfileAccount = ({ classes }) => { } }; fetchWallets(); - }, [dispatch]); + // eslint + }, [dispatch, getWallets]); useEffect(() => { const getProviders = async () => { @@ -81,7 +85,7 @@ const UserProfileAccount = ({ classes }) => { }; getProviders(); - }, [selectedWallet]); + }, [selectedWallet, dispatch]); const isSameMetaMaskAddress = (address) => { if (currentAddress && address) { @@ -90,9 +94,8 @@ const UserProfileAccount = ({ classes }) => { return false; }; - const handleWalletTypeChange = async (event) => { + const handleWalletTypeChange = (event) => { setAlert({}); - const { value: selectedValue } = event.target; const selectedWallet = wallets.find(({ value }) => selectedValue === value); setSelectedWallet(selectedWallet); diff --git a/src/components/UserProfile/index.js b/src/components/UserProfile/index.js index 56beda886..19bf785b1 100644 --- a/src/components/UserProfile/index.js +++ b/src/components/UserProfile/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useCallback, useEffect, useMemo, useState } from "react"; import { withStyles } from "@mui/styles"; import AppBar from "@mui/material/AppBar"; import Tabs from "@mui/material/Tabs"; @@ -21,46 +21,55 @@ export const userProfileRoutes = { // MODELS: { path: `/${Routes.USER_PROFILE}/models`, component: () => }, }; -const tabs = { - account: { - name: "Account", - index: 0, - path: userProfileRoutes.ACCOUNT, - component: , - }, - settings: { - name: "Settings", - index: 1, - path: userProfileRoutes.SETTINGS, - component: , - }, - transactions: { - name: "Transactions", - index: 2, - path: userProfileRoutes.TRANSACTIONS, - component: , - }, -}; +const UserProfile = ({ classes, nickname, email }) => { + const tabs = useMemo( + () => ({ + account: { + name: "Account", + index: 0, + path: userProfileRoutes.ACCOUNT, + component: , + }, + settings: { + name: "Settings", + index: 1, + path: userProfileRoutes.SETTINGS, + component: , + }, + transactions: { + name: "Transactions", + index: 2, + path: userProfileRoutes.TRANSACTIONS, + component: , + }, + }), + [] + ); -const tabByPath = { - [`${tabs.account.path}`]: "account", - [`${tabs.settings.path}`]: "settings", - [`${tabs.transactions.path}`]: "transactions", -}; + const tabByPath = useMemo( + () => ({ + [`${tabs.account.path}`]: "account", + [`${tabs.settings.path}`]: "settings", + [`${tabs.transactions.path}`]: "transactions", + }), + [tabs] + ); -const UserProfile = ({ classes, nickname, email }) => { const navigate = useNavigate(); const location = useLocation(); const [activeTab, setActiveTab] = useState(tabs.account); - const selectTab = (tab) => { - setActiveTab(tab); - navigate(tab.path); - }; + const selectTab = useCallback( + (tab) => { + setActiveTab(tab); + navigate(tab.path); + }, + [navigate] + ); useEffect(() => { selectTab(tabs[tabByPath[`${location.pathname.toLowerCase()}`]]); - }, [location]); + }, [location.pathname, tabs, tabByPath, selectTab]); return (
From a446e6b6fb590d607ae86b0a6c11d8d1915b3f4d Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 13:45:03 +0300 Subject: [PATCH 3/7] [SPT-532] fixed change network in metamask --- src/utility/sdk.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utility/sdk.js b/src/utility/sdk.js index 56c0f403c..c556da9b9 100644 --- a/src/utility/sdk.js +++ b/src/utility/sdk.js @@ -15,7 +15,7 @@ const DEFAULT_GAS_LIMIT = 210000; const ON_ACCOUNT_CHANGE = "accountsChanged"; const ON_NETWORK_CHANGE = "chainChanged"; -const EXPECTED_ID_ETHEREUM_NETWORK = process.env.REACT_APP_ETH_NETWORK; +const EXPECTED_ID_ETHEREUM_NETWORK = Number(process.env.REACT_APP_ETH_NETWORK); let sdk; let channel; From 9e49669b7684155b9026df82b2876914fd0c061c Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 13:45:22 +0300 Subject: [PATCH 4/7] [SPT-518] fixed lint errors --- src/components/common/AppLoader/index.js | 2 +- src/components/common/Header/NavItem.js | 22 +--------------------- 2 files changed, 2 insertions(+), 22 deletions(-) diff --git a/src/components/common/AppLoader/index.js b/src/components/common/AppLoader/index.js index 733cd24c6..215e93e56 100644 --- a/src/components/common/AppLoader/index.js +++ b/src/components/common/AppLoader/index.js @@ -15,7 +15,7 @@ export const AppLoader = ({ loading, loaderHeader, loaderText }) => { const classes = useStyles(); return ( - + {loaderHeader}} /> diff --git a/src/components/common/Header/NavItem.js b/src/components/common/Header/NavItem.js index a9659d9d1..d2c40340c 100644 --- a/src/components/common/Header/NavItem.js +++ b/src/components/common/Header/NavItem.js @@ -1,33 +1,13 @@ import React from "react"; import { NavLink } from "react-router-dom"; - import { useStyles } from "./styles"; -import Routes from "../../../utility/constants/Routes"; const NavItem = ({ title, link }) => { const classes = useStyles(); - const isActive = (unused, { pathname }) => { - switch (link) { - case `/${Routes.AI_MARKETPLACE}`: { - if (pathname === "/" || pathname.includes(Routes.AI_MARKETPLACE)) { - return true; - } - return false; - } - - default: { - return pathname === link; - } - } - }; return (
  • - classes.navLinksAnchor + (isActive ? " activated" : classes.activeTab)} TODO - isActive={isActive} - > + {title}
    • From 3cd01db37860d1525cdcfa04c5fa979e8242df0d Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 14:27:33 +0300 Subject: [PATCH 5/7] [SPT-526] fixed scalling service image --- src/components/ServiceDetails/TitleCard/styles.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/components/ServiceDetails/TitleCard/styles.js b/src/components/ServiceDetails/TitleCard/styles.js index cfe3ed544..126c4ea80 100644 --- a/src/components/ServiceDetails/TitleCard/styles.js +++ b/src/components/ServiceDetails/TitleCard/styles.js @@ -89,9 +89,6 @@ export const useStyles = (theme) => ({ margin: "0 auto", }, }, - serviceLightBox: { - position: "relative", - }, serviceImgContainer: { boxSizing: "border-box", width: 1045, From 3cc31de6164d17c4c9dbc611aed5cf4006efbfcc Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 14:28:08 +0300 Subject: [PATCH 6/7] [SPT-518] removed console.log --- src/components/common/SeoMetadata.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/common/SeoMetadata.js b/src/components/common/SeoMetadata.js index 8a313f67b..8b0d07c0f 100644 --- a/src/components/common/SeoMetadata.js +++ b/src/components/common/SeoMetadata.js @@ -13,7 +13,6 @@ const SeoMetadata = (props) => { .slice(0, totalKeywordsAllowed) .join(",") : undefined; - console.log("keywordsCommaDelimitedString", keywordsCommaDelimitedString); return ( From 057a9cad47cdb61173d25090793824a677117b83 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Thu, 15 Aug 2024 14:28:33 +0300 Subject: [PATCH 7/7] [SPT-526] fixed overflowing project details --- .../ServiceDetails/ProjectDetails/index.js | 4 +-- .../ServiceDetails/ProjectDetails/styles.js | 25 +++++++++++++++++++ 2 files changed, 27 insertions(+), 2 deletions(-) diff --git a/src/components/ServiceDetails/ProjectDetails/index.js b/src/components/ServiceDetails/ProjectDetails/index.js index db879cabe..8a317ba86 100644 --- a/src/components/ServiceDetails/ProjectDetails/index.js +++ b/src/components/ServiceDetails/ProjectDetails/index.js @@ -27,8 +27,8 @@ const ProjectDetails = ({ classes, projectURL, contributors, orgId, serviceId })
    {dataRow.label}
     - - {dataRow.value} + + {dataRow.value} ))} diff --git a/src/components/ServiceDetails/ProjectDetails/styles.js b/src/components/ServiceDetails/ProjectDetails/styles.js index 0135a3b90..41a72f842 100644 --- a/src/components/ServiceDetails/ProjectDetails/styles.js +++ b/src/components/ServiceDetails/ProjectDetails/styles.js @@ -11,6 +11,31 @@ export const useStyles = (theme) => ({ lineHeight: "22px", }, }, + projectDetailsValue: { + width: "100%", + textAlign: "left", + position: "relative", + height: "1rem", + "& span": { + width: "100%", + overflow: "hidden", + textOverflow: "ellipsis", + display: "-webkit-box", + height: "min-content", + "-webkit-line-clamp": 1, + "-webkit-box-orient": "vertical", + transition: "all 0.1s", + overflowWrap: "break-word", + }, + "& span:hover": { + height: "min-content", + background: "white", + paddingBottom: 5, + "-webkit-line-clamp": 10, + borderRadius: 5, + transition: "all 0.1s", + }, + }, projectURLContainer: { "& > div": { display: "flex",