Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: bug overall #617

Merged
merged 4 commits into from
Nov 9, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Bug fixes

- [#617](https://github.com/alleslabs/celatone-frontend/pull/617) Fix textwrap module path on module detail, framer motion incorrect transition prop, loadingoverlay not centered
- [#610](https://github.com/alleslabs/celatone-frontend/pull/610) Remove `.at()` from code
- [#615](https://github.com/alleslabs/celatone-frontend/pull/615) Fix useEffect on pool page
- [#612](https://github.com/alleslabs/celatone-frontend/pull/612) Add saved accounts page
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/LoadingOverlay.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export const LoadingOverlay = () => (
direction="column"
gap={3}
bgColor="background.overlay"
position="absolute"
position="fixed"
top={0}
left={0}
zIndex="overlay"
Expand Down
69 changes: 41 additions & 28 deletions src/lib/pages/account-details/components/modules/ModuleLists.tsx
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
import { Flex } from "@chakra-ui/react";
import { useState } from "react";

import { useMobile } from "lib/app-provider";
import { CustomIcon } from "lib/components/icon";
import { TableTitle } from "lib/components/table";
import InputWithIcon from "lib/components/InputWithIcon";
import { TableTitle, ViewMore } from "lib/components/table";
import { type IndexedModule } from "lib/services/move/moduleService";
import type { MoveAccountAddr, Option } from "lib/types";

Expand All @@ -23,41 +25,52 @@ export const ModuleLists = ({
isLoading,
onViewMore,
}: ModuleListsProps) => {
const [keyword, setKeyword] = useState("");
const isMobile = useMobile();
const isMobileOverview = isMobile && !!onViewMore;
return (
return isMobileOverview ? (
<Flex
justify="space-between"
w="full"
bg="gray.900"
borderRadius="8px"
p={4}
onClick={onViewMore}
>
<TableTitle title="Modules" count={totalCount} mb={0} />
<CustomIcon name="chevron-right" color="gray.600" />
</Flex>
) : (
<Flex
direction="column"
mt={{ base: 4, md: 8 }}
mb={{ base: 0, md: 8 }}
width="full"
gap={6}
>
{isMobileOverview ? (
<Flex
justify="space-between"
w="full"
bg="gray.900"
borderRadius="8px"
p={4}
onClick={onViewMore}
>
<TableTitle title="Modules" count={totalCount} mb={0} />
<CustomIcon name="chevron-right" color="gray.600" />
</Flex>
) : (
<>
<TableTitle
title="Module Instances"
helperText="Modules are ‘smart contracts’ deployed by this account"
count={totalCount}
/>
<ModuleListsBody
selectedAddress={selectedAddress}
modules={modules}
isLoading={isLoading}
onViewMore={onViewMore}
/>
</>
<TableTitle
title="Module Instances"
helperText="Modules are ‘smart contracts’ deployed by this account"
count={totalCount}
mb={0}
/>
{!onViewMore && (
<InputWithIcon
placeholder="Search with Module Name..."
value={keyword}
onChange={(e) => setKeyword(e.target.value)}
action="execute-message-search"
/>
)}
<ModuleListsBody
selectedAddress={selectedAddress}
keyword={keyword}
modules={modules}
isLoading={isLoading}
onViewMore={onViewMore}
/>
{onViewMore && totalCount && totalCount > 9 && (
<ViewMore onClick={onViewMore} />
)}
</Flex>
);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,31 +1,30 @@
import { Flex, SimpleGrid } from "@chakra-ui/react";
import { useMemo, useState } from "react";
import { SimpleGrid } from "@chakra-ui/react";
import { useMemo } from "react";

import { ErrorFetching } from "../ErrorFetching";
import { useInternalNavigate } from "lib/app-provider";
import InputWithIcon from "lib/components/InputWithIcon";
import { Loading } from "lib/components/Loading";
import { ModuleCard } from "lib/components/module";
import { EmptyState } from "lib/components/state";
import { ViewMore } from "lib/components/table";
import type { IndexedModule } from "lib/services/move/moduleService";
import type { MoveAccountAddr, Option } from "lib/types";

interface ModuleListsBodyProps {
selectedAddress: MoveAccountAddr;
keyword: string;
modules: Option<IndexedModule[]>;
isLoading: boolean;
onViewMore?: () => void;
}

export const ModuleListsBody = ({
selectedAddress,
keyword,
modules,
isLoading,
onViewMore,
}: ModuleListsBodyProps) => {
const navigate = useInternalNavigate();
const [keyword, setKeyword] = useState("");

const filteredModules = useMemo(() => {
if (!keyword) return modules;
Expand Down Expand Up @@ -58,31 +57,18 @@ export const ModuleListsBody = ({
/>
);
return (
<Flex direction="column" gap={8}>
{!onViewMore && (
<InputWithIcon
placeholder="Search with Module Name..."
value={keyword}
onChange={(e) => setKeyword(e.target.value)}
action="execute-message-search"
/>
<SimpleGrid columns={{ sm: 1, md: 2, lg: 3 }} spacing={4}>
{(onViewMore ? filteredModules.slice(0, 9) : filteredModules).map(
(item) => (
<ModuleCard
key={item.moduleName}
selectedAddress={selectedAddress}
module={item}
selectedModule={undefined}
setSelectedModule={handleOnSelect}
/>
)
)}
<SimpleGrid columns={{ sm: 1, md: 2, lg: 3 }} spacing={4} mb={6}>
{(onViewMore ? filteredModules.slice(0, 9) : filteredModules).map(
(item) => (
<ModuleCard
key={item.moduleName}
selectedAddress={selectedAddress}
module={item}
selectedModule={undefined}
setSelectedModule={handleOnSelect}
/>
)
)}
</SimpleGrid>
{onViewMore && filteredModules.length > 9 && (
<ViewMore onClick={onViewMore} />
)}
</Flex>
</SimpleGrid>
);
};
2 changes: 1 addition & 1 deletion src/lib/pages/account-details/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -404,8 +404,8 @@ const AccountDetailsBody = ({
</TabPanel>
<TabPanel p={0}>
<ModuleLists
selectedAddress={accountAddress}
totalCount={modulesData?.length}
selectedAddress={accountAddress}
modules={modulesData}
isLoading={isModulesLoading}
/>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/pages/module-details/components/ModuleTop.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ export const ModuleTop = ({ moduleData, isVerified }: ModuleTopProps) => {
<Text {...baseTextStyle} color="text.main">
Module Path:
</Text>
<Text {...baseTextStyle}>
<Text {...baseTextStyle} whiteSpace="normal">
{moduleData.parsedAbi.address}::{moduleData.parsedAbi.name}
</Text>
</Flex>
Expand Down
14 changes: 6 additions & 8 deletions src/lib/pages/tx-details/components/tx-message/EventBox.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { Box, Flex, chakra, shouldForwardProp } from "@chakra-ui/react";
import { Box, Flex } from "@chakra-ui/react";
import type { Event } from "@cosmjs/stargate";
import { isValidMotionProp, motion } from "framer-motion";
import type { ReactNode } from "react";
import { useState } from "react";

Expand All @@ -10,15 +9,11 @@ import type { LinkType } from "lib/components/ExplorerLink";
import { ExplorerLink } from "lib/components/ExplorerLink";
import { CustomIcon } from "lib/components/icon";
import JsonReadOnly from "lib/components/json/JsonReadOnly";
import { MotionBox } from "lib/components/MotionBox";
import { TxReceiptRender } from "lib/components/tx";
import type { TxReceipt } from "lib/types";
import { jsonPrettify, jsonValidate } from "lib/utils";

const MotionBox = chakra(motion.div, {
shouldForwardProp: (prop) =>
isValidMotionProp(prop) || shouldForwardProp(prop),
});

interface EventBoxProps {
event: Event;
msgIndex: number;
Expand Down Expand Up @@ -145,7 +140,10 @@ export const EventBox = ({ event, msgIndex }: EventBoxProps) => {
overflow="hidden"
initial="collapsed"
animate={expand ? "expanded" : "collapsed"}
transition="all 0.25s ease-in-out"
transition={{
duration: "0.25",
ease: "easeInOut",
}}
>
<Box borderTop="1px solid var(--chakra-colors-gray-700)" mx={4} />
<TxReceiptRender
Expand Down
2 changes: 1 addition & 1 deletion src/lib/styles/theme/components/form.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ const errorMain = "error.main";
const labelStyles = {
top: 0,
left: 0,
zIndex: 2,
zIndex: 1,
position: "absolute",
pointerEvents: "none",
mx: 3,
Expand Down
19 changes: 9 additions & 10 deletions src/lib/utils/abi.ts
Original file line number Diff line number Diff line change
Expand Up @@ -55,16 +55,15 @@ export const getAbiInitialData = (length: number) =>
// ------------------------------------------//
// -----------------MOVE ARGS----------------//
// ------------------------------------------//
export const getArgType = (argType: string) => {
if (argType === "0x1::string::String") return BCS.STRING;
if (argType.startsWith("0x1::option::Option")) return BCS.OPTION;
if (argType.startsWith("0x1::object::Object")) return BCS.OBJECT;
if (argType === "0x1::fixed_point32::FixedPoint32") return BCS.FIXED_POINT32;
if (argType === "0x1::fixed_point64::FixedPoint64") return BCS.FIXED_POINT64;
if (argType === "0x1::decimal128::Decimal128") return BCS.DECIMAL128;
if (argType === "0x1::decimal256::Decimal256") return BCS.DECIMAL256;
return argType;
};
export const getArgType = (argType: string) =>
argType
.replace("0x1::string::String", BCS.STRING)
.replace("0x1::option::Option", BCS.OPTION)
.replace("0x1::object::Object", BCS.OBJECT)
.replace("0x1::fixed_point32::FixedPoint32", BCS.FIXED_POINT32)
.replace("0x1::fixed_point64::FixedPoint64", BCS.FIXED_POINT64)
.replace("0x1::decimal128::Decimal128", BCS.DECIMAL128)
.replace("0x1::decimal256::Decimal256", BCS.DECIMAL256);

const getArgValue = ({
type,
Expand Down
Loading