fix(mfi-v2-ui): build errors

mrgnlabs · Oct 5, 2023 · 8e5dfa7 · 8e5dfa7
1 parent 06ccbe2
commit 8e5dfa7
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 32 deletions.
diff --git a/apps/marginfi-v2-ui/src/components/common/icons/More.tsx b/apps/marginfi-v2-ui/src/components/common/icons/More.tsx
@@ -0,0 +1,10 @@
+import React, { FC, SVGProps } from "react";
+
+const More: FC<SVGProps<SVGSVGElement>> = ({ color = "#868E95", ...props }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill={color}>
+    <path d="M0 0h24v24H0V0z" fill="none" />
+    <path d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" />
+  </svg>
+);
+
+export { More };
diff --git a/apps/marginfi-v2-ui/src/components/common/icons/index.ts b/apps/marginfi-v2-ui/src/components/common/icons/index.ts
@@ -1,3 +1,7 @@
-export * from "./PieChart"
-export * from "./ReceiveMoney"
-export * from "./TokenSwap"
+export * from "./PieChart";
+export * from "./ReceiveMoney";
+export * from "./TokenSwap";
+export * from "./More";
+export * from "./Steak";
+export * from "./Coins";
+export * from "./Bridge";
diff --git a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx
@@ -46,10 +46,7 @@ export const AssetCard: FC<{
     [bank.info.state.mint, bank.userInfo.tokenAccount, nativeSolBalance]
   );
 
-  const currentAction: ActionType = useMemo(
-    () => getCurrentAction(isInLendingMode, bank),
-    [connected, isInLendingMode, bank]
-  );
+  const currentAction: ActionType = useMemo(() => getCurrentAction(isInLendingMode, bank), [isInLendingMode, bank]);
 
   const handleCloseBalance = useCallback(async () => {
     try {

diff --git a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx
@@ -1,22 +1,13 @@
 import React, { FC, useMemo, useRef, useState } from "react";
 import Image from "next/image";
 import { ExtendedBankInfo } from "@mrgnlabs/marginfi-v2-ui-state";
-import {
-  FormControl,
-  FormHelperText,
-  MenuItem,
-  Select,
-  SelectChangeEvent,
-  Skeleton,
-  Typography,
-  paperClasses,
-} from "@mui/material";
+import { FormControl, MenuItem, Select, SelectChangeEvent, Skeleton, Typography } from "@mui/material";
 import { useMrgnlendStore } from "~/store";
 import { useWalletContext } from "~/hooks/useWalletContext";
 import { MrgnContainedSwitch, MrgnLabeledSwitch, MrgnTooltip } from "~/components/common";
 
 import { AssetCard } from "./AssetCard";
-import { SORT_OPTIONS_MAP, SortAssetOption, sortApRate, sortTvl } from "./MobileAssetsList.utils";
+import { SORT_OPTIONS_MAP, SortAssetOption, SortType, sortApRate, sortTvl } from "./MobileAssetsList.utils";
 
 export const MobileAssetsList: FC = () => {
   const [isFiltered, setIsFiltered] = useState(false);
@@ -33,12 +24,10 @@ export const MobileAssetsList: FC = () => {
   const inputRefs = useRef<Record<string, HTMLInputElement | null>>({});
   const [isInLendingMode, setIsInLendingMode] = useState(true);
 
-  // const test = useMemo(() => sortedBanks && sortedBanks.sort((a,b) => a.) ,[])
-
-  const sortBanks = (banks: ExtendedBankInfo) => {
-    if (sortOption.field === "APY") {
+  const sortBanks = (banks: ExtendedBankInfo[]) => {
+    if (sortOption?.field === "APY") {
       return sortApRate(banks, isInLendingMode, sortOption.direction);
-    } else if (sortOption.field === "TVL") {
+    } else if (sortOption?.field === "TVL") {
       return sortTvl(banks, sortOption.direction);
     } else {
       return banks;
@@ -69,7 +58,7 @@ export const MobileAssetsList: FC = () => {
   }, [sortedBanks, isFiltered, sortOption]);
 
   const handleSortChange = (event: SelectChangeEvent) => {
-    setSortOption(SORT_OPTIONS_MAP[event.target.value]);
+    setSortOption(SORT_OPTIONS_MAP[event.target.value as SortType]);
   };
 
   return (
@@ -131,6 +120,7 @@ export const MobileAssetsList: FC = () => {
               </MenuItem>
               {Object.values(SORT_OPTIONS_MAP).map((option) => (
                 <MenuItem
+                  key={option.value}
                   sx={{
                     color: "white",
                     backgroundColor: "#22282c",

diff --git a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.utils.ts b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.utils.ts
@@ -10,7 +10,7 @@ export type SortAssetOption = {
 
 type sortDirection = "ASC" | "DESC";
 
-type SortType = "APY_ASC" | "APY_DESC" | "TVL_ASC" | "TVL_DESC";
+export type SortType = "APY_ASC" | "APY_DESC" | "TVL_ASC" | "TVL_DESC";
 
 export const SORT_OPTIONS_MAP: { [key in SortType]: SortAssetOption } = {
   APY_DESC: {

diff --git a/apps/marginfi-v2-ui/src/config/navigationLinks.ts b/apps/marginfi-v2-ui/src/config/navigationLinks.ts
@@ -1,10 +1,5 @@
 import { FC, SVGProps } from "react";
-import { PieChart, ReceiveMoney, TokenSwap } from "~/components/common/icons";
-import { Bridge } from "~/components/common/icons/Bridge";
-import { Coins } from "~/components/common/icons/Coins";
-import { Steak } from "~/components/common/icons/Steak";
-import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
-
+import { PieChart, ReceiveMoney, TokenSwap, More, Bridge, Coins, Steak } from "~/components/common/icons";
 export interface NavLinkInfo {
   href: string;
   alt: string;
@@ -36,7 +31,7 @@ export const ORDERED_MOBILE_NAVBAR_LINKS: NavLinkInfo[] = [
     href: "",
     alt: "more menu icon",
     label: "more",
-    Icon: MoreHorizIcon,
+    Icon: More,
   },
 ];