diff --git a/ui/app/actions/actions.ts b/ui/app/actions/actions.ts
index 2b1b708..44cb462 100644
--- a/ui/app/actions/actions.ts
+++ b/ui/app/actions/actions.ts
@@ -375,3 +375,30 @@ export async function getActivities({
);
return await res.json();
}
+
+export async function getDomainActivities({
+ domainName,
+ page,
+ size,
+ orderBy,
+ sortBy,
+}: {
+ domainName: string;
+ page: number;
+ size: number;
+ orderBy: ORDER_BY;
+ sortBy: SORT_BY;
+}) {
+ if (!domainName) return;
+
+ const res = await fetch(
+ `${process.env.Non_NEXT_PUBLIC_API_URL}/activities/domain/${domainName}?page=${page}&size=${size}&orderBy=${orderBy}&sortBy=${sortBy}`,
+ {
+ headers: {
+ "Content-Type": "application/json",
+ "x-api-key": process.env.Non_NEXT_PUBLIC_API_KEY,
+ },
+ }
+ );
+ return await res.json();
+}
diff --git a/ui/comman/types.ts b/ui/comman/types.ts
index 2b6eb94..1b412e7 100644
--- a/ui/comman/types.ts
+++ b/ui/comman/types.ts
@@ -56,6 +56,8 @@ export type TableConfig = {
icon?: string | React.ReactElement;
onClick?: string;
hash?: string;
+ redirectLink?: string;
+ link?: string;
};
view?: View;
sortBy?: SORT_BY;
@@ -100,4 +102,4 @@ export enum NetworkID {
mainnet = "mina:mainnet",
devnet = "mina:testnet",
berkeley = "mina:berkeley",
-}
\ No newline at end of file
+}
diff --git a/ui/components/molecules/modals/modalInfo/index.module.css b/ui/components/molecules/modals/modalInfo/index.module.css
index 3406195..75c2d4f 100644
--- a/ui/components/molecules/modals/modalInfo/index.module.css
+++ b/ui/components/molecules/modals/modalInfo/index.module.css
@@ -87,3 +87,7 @@
.leftSideHeader {
font-size: 16px;
}
+
+.bottomContent a {
+ color: var(--link-active-color);
+}
diff --git a/ui/components/molecules/modals/modalInfo/modalInfo.tsx b/ui/components/molecules/modals/modalInfo/modalInfo.tsx
index a0c88ce..a4f9d5d 100644
--- a/ui/components/molecules/modals/modalInfo/modalInfo.tsx
+++ b/ui/components/molecules/modals/modalInfo/modalInfo.tsx
@@ -15,6 +15,7 @@ import TruncateText from "../../truncateText/truncateText";
import { addMinaText } from "@/helpers/name.helper";
import { useRouter } from "next/navigation";
import { ModalInfoProps } from "../modals.types";
+import { chain } from "@/comman/constants";
const ModalInfo = ({ data }: ModalInfoProps): JSX.Element => {
const router = useRouter();
@@ -88,12 +89,13 @@ const ModalInfo = ({ data }: ModalInfoProps): JSX.Element => {
{renderContentItem({
header: "Domain Owner",
- action: () => router.push(`${Routs.NAMES}/${ownerAddress}`),
+ url: `https://minascan.io/${chain}/account/${ownerAddress}/txs`,
content: (
),
})}
diff --git a/ui/components/molecules/staticEllipse/index.module.css b/ui/components/molecules/staticEllipse/index.module.css
index 566b19a..59dcc4c 100644
--- a/ui/components/molecules/staticEllipse/index.module.css
+++ b/ui/components/molecules/staticEllipse/index.module.css
@@ -7,6 +7,11 @@
.wrapper a {
display: flex;
+ color: var(--link-active-color);
+}
+
+.wrapper a .dot {
+ background-color: var(--link-active-color);
}
.wrapper a:hover {
diff --git a/ui/components/molecules/staticEllipse/staticEllipse.tsx b/ui/components/molecules/staticEllipse/staticEllipse.tsx
index 3d8062e..3bcbb70 100644
--- a/ui/components/molecules/staticEllipse/staticEllipse.tsx
+++ b/ui/components/molecules/staticEllipse/staticEllipse.tsx
@@ -5,6 +5,7 @@ import classNames from "classnames";
import { View } from "@/comman/types";
import { robotoMedium } from "@/app/fonts";
import { useMedia } from "@/hooks";
+import Link from "next/link";
const StaticEllipse = ({
text,
@@ -63,6 +64,8 @@ const StaticEllipse = ({
if ((!firstString || !secondString || !text) && !string) return null;
if (link) {
+ const isExternal = link.includes("http");
+
return (
diff --git a/ui/components/organisms/accountConent/accountContent.tsx b/ui/components/organisms/accountConent/accountContent.tsx
index 8eaee5f..82a2f8d 100644
--- a/ui/components/organisms/accountConent/accountContent.tsx
+++ b/ui/components/organisms/accountConent/accountContent.tsx
@@ -9,6 +9,7 @@ import Image from "next/image";
import classNames from "classnames";
import { useParams } from "next/navigation";
import { useStoreContext } from "@/store";
+import TruncateText from "@/components/molecules/truncateText";
const AccountContent = () => {
const params = useParams();
@@ -21,8 +22,8 @@ const AccountContent = () => {
return (
-
- {params?.id || accountId}
+
+ {params?.id || accountId}
{
useEffect(() => {
(async () => {
- try {
+ try {
setLoading(true);
const response: DataTable = await getActivities({
accountAddress: (params?.id as string) || accountId,
@@ -35,13 +36,16 @@ const ActivityContent = (): JSX.Element => {
orderBy: ORDER_BY.DESC,
});
- setActivities({...response,
+ setActivities({
+ ...response,
content: response?.content?.map((item) => {
return {
...item,
- domainName: addMinaText(item?.domainName)
- }
- })
+ domainNameRedirect: `${Routs.NAME}/${item.id}`,
+ redirectLink: `https://minascan.io/${chain}/tx/${item.transaction}`,
+ domainName: addMinaText(item?.domainName),
+ };
+ }),
});
} catch (error) {}
setLoading(false);
@@ -57,7 +61,6 @@ const ActivityContent = (): JSX.Element => {
setPage(page);
};
-
return (
{
+ const [loading, setLoading] = useState(true);
+ const [size, setSize] = useState(initSize);
+ const [page, setPage] = useState(initPage);
+ const [activities, setActivities] = useState(null);
+
+ useEffect(() => {
+ (async () => {
+ try {
+ setLoading(true);
+ const response: DataTable = await getDomainActivities({
+ domainName: domainName,
+ page,
+ size,
+ sortBy: SORT_BY.TIMESTAMP,
+ orderBy: ORDER_BY.DESC,
+ });
+
+ setActivities({
+ ...response,
+ content: response?.content?.map((item) => {
+ return {
+ ...item,
+ domainNameRedirect: `${Routs.NAME}/${item.id}`,
+ redirectLink: `https://minascan.io/${chain}/tx/${item.transaction}`,
+ domainName: addMinaText(item?.domainName),
+ };
+ }),
+ });
+ } catch (error) {}
+ setLoading(false);
+ })();
+ }, [domainName, size, page]);
+
+ const onSize = (size) => {
+ setPage(initPage);
+ setSize(size);
+ };
+
+ const onPage = (page) => {
+ setPage(page);
+ };
+ console.log(activities);
+
+ return (
+ {
+ console.log(data);
+ }}
+ onChangeOrder={(data) => {
+ console.log(data);
+ }}
+ />
+ );
+};
+
+export { ActivityContent };
diff --git a/ui/components/organisms/detailsNameInfo/components/index.ts b/ui/components/organisms/detailsNameInfo/components/index.ts
index e08dfe7..b97f765 100644
--- a/ui/components/organisms/detailsNameInfo/components/index.ts
+++ b/ui/components/organisms/detailsNameInfo/components/index.ts
@@ -1,2 +1,2 @@
-export { OwnershipContent } from "./ownership";
+export { ActivityContent } from "./activity";
export { ProfileContent } from "./profile";
diff --git a/ui/components/organisms/detailsNameInfo/components/ownership/index.tsx b/ui/components/organisms/detailsNameInfo/components/ownership/index.tsx
deleted file mode 100644
index e9d5c17..0000000
--- a/ui/components/organisms/detailsNameInfo/components/ownership/index.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-const OwnershipContent = (): JSX.Element => {
- return dfhg
;
-};
-
-export { OwnershipContent };
diff --git a/ui/components/organisms/detailsNameInfo/components/profile/index.module.css b/ui/components/organisms/detailsNameInfo/components/profile/index.module.css
index ad44de3..1341e95 100644
--- a/ui/components/organisms/detailsNameInfo/components/profile/index.module.css
+++ b/ui/components/organisms/detailsNameInfo/components/profile/index.module.css
@@ -29,6 +29,16 @@
color: rgb(113, 145, 252);
}
+.icon {
+ margin-left: 12px;
+ cursor: pointer;
+ transition: all .2s;
+}
+
+.icon:hover {
+ opacity: .6;
+}
+
.staticEllipse {
color: #1a1a1b;
}
diff --git a/ui/components/organisms/detailsNameInfo/components/profile/index.tsx b/ui/components/organisms/detailsNameInfo/components/profile/index.tsx
index ea9632f..68b2f15 100644
--- a/ui/components/organisms/detailsNameInfo/components/profile/index.tsx
+++ b/ui/components/organisms/detailsNameInfo/components/profile/index.tsx
@@ -6,6 +6,11 @@ import { dayMonthYearTimeFormat } from "@/helpers/timeHelper";
import { StaticEllipse } from "@/components/molecules/staticEllipse";
import { CopyIcon } from "@/components/atoms/copyIcon";
import React, { ReactNode } from "react";
+import defaultIcon from "../../../../../assets/default.svg";
+import { Routs } from "@/comman/types";
+import Image from "next/image";
+import Link from "next/link";
+import { chain } from "@/comman/constants";
const ProfileContent = ({
accountDomainDetails,
@@ -16,10 +21,14 @@ const ProfileContent = ({
title,
value,
isEllipse,
+ link,
+ icon,
}: {
title: string;
value?: any;
isEllipse?: boolean;
+ link?: string;
+ icon?: string;
}): JSX.Element => {
return (
@@ -33,21 +42,33 @@ const ProfileContent = ({
)}
text={value}
view={{ sm: 10, md: 14, lg: 18 }}
+ link={link}
/>
>
) : (
{value}
)}
+ {icon && (
+
+
+
+ )}
);
};
+
return (
{itemRender({
title: "Owner",
value: accountDomainDetails.ownerAddress,
+ link: `${Routs.NAMES}/${accountDomainDetails.ownerAddress}`,
isEllipse: true,
+ icon: defaultIcon,
})}
{itemRender({
title: "IPFS",
@@ -72,6 +93,7 @@ const ProfileContent = ({
{itemRender({
title: "Creation Transaction",
value: accountDomainDetails.transaction,
+ link: `https://minascan.io/${chain}/tx/${accountDomainDetails.transaction}`,
isEllipse: true,
})}
{itemRender({
diff --git a/ui/components/organisms/detailsNameInfo/detailsNameInfo.tsx b/ui/components/organisms/detailsNameInfo/detailsNameInfo.tsx
index c050444..8e5f60d 100644
--- a/ui/components/organisms/detailsNameInfo/detailsNameInfo.tsx
+++ b/ui/components/organisms/detailsNameInfo/detailsNameInfo.tsx
@@ -19,6 +19,7 @@ import { Star } from "@/components/atoms/star";
import { TABS_VARIANT, Tabs } from "@/components/molecules/tabs";
import { ProfileContent } from "./components";
import { addMinaText } from "@/helpers/name.helper";
+import { ActivityContent } from "./components/activity";
const DetailsNameInfo = ({
accountDomainDetails,
@@ -114,15 +115,17 @@ const DetailsNameInfo = ({
)}
-
-
-
+ {isOwner && (
+
+
+
+ )}
+ ),
+ title: "Activity",
+ value: 2,
+ },
]}
initValue={1}
/>
diff --git a/ui/components/organisms/table/templates/index.tsx b/ui/components/organisms/table/templates/index.tsx
index 6fd9839..05b3d2b 100644
--- a/ui/components/organisms/table/templates/index.tsx
+++ b/ui/components/organisms/table/templates/index.tsx
@@ -6,6 +6,7 @@ import ButtonTemplate from "./buttonTemplate/buttonTemplate";
import TimeTemplate from "./timeTemplate/timeTemplate";
import { CounterTemplate } from "./counterTemplate";
import { IconTemplate } from "./iconTemplate";
+import { LinkTemplate } from "./linkTemplate";
export enum TableTemplates {
STRING = "string",
@@ -16,6 +17,7 @@ export enum TableTemplates {
TIME = "time",
COUNTER = "counter",
ICON = "icon",
+ LINK = "link",
}
const getCell = ({ data, config }): JSX.Element => {
@@ -34,6 +36,8 @@ const getCell = ({ data, config }): JSX.Element => {
return ;
case TableTemplates.ICON:
return ;
+ case TableTemplates.LINK:
+ return ;
}
};
diff --git a/ui/components/organisms/table/templates/linkTemplate/index.module.css b/ui/components/organisms/table/templates/linkTemplate/index.module.css
new file mode 100644
index 0000000..0e837cd
--- /dev/null
+++ b/ui/components/organisms/table/templates/linkTemplate/index.module.css
@@ -0,0 +1,8 @@
+.link {
+ color: var(--link-active-color);
+ transition: all .2s;
+}
+
+.link:hover {
+ color: var(--col--link);
+}
\ No newline at end of file
diff --git a/ui/components/organisms/table/templates/linkTemplate/index.ts b/ui/components/organisms/table/templates/linkTemplate/index.ts
new file mode 100644
index 0000000..48a720c
--- /dev/null
+++ b/ui/components/organisms/table/templates/linkTemplate/index.ts
@@ -0,0 +1 @@
+export { default as LinkTemplate } from "./linkTemplate";
diff --git a/ui/components/organisms/table/templates/linkTemplate/linkTemplate.tsx b/ui/components/organisms/table/templates/linkTemplate/linkTemplate.tsx
new file mode 100644
index 0000000..a5fd30a
--- /dev/null
+++ b/ui/components/organisms/table/templates/linkTemplate/linkTemplate.tsx
@@ -0,0 +1,33 @@
+import Link from "next/link";
+import { FC } from "react";
+
+import style from "./index.module.css";
+import TruncateText from "@/components/molecules/truncateText";
+
+type LinkTemplateProps = {
+ data: any;
+ config: {
+ fields: {
+ link: string;
+ value: string;
+ };
+ };
+};
+const LinkTemplate: FC = ({ data, config }) => {
+ const link = data[config.fields.link];
+ const value = data[config.fields.value];
+
+ return (
+ <>
+ {link && value ? (
+
+ {value}
+
+ ) : (
+ "-"
+ )}
+ >
+ );
+};
+
+export default LinkTemplate;
diff --git a/ui/components/organisms/table/templates/namesTemplate/namesTemplate.tsx b/ui/components/organisms/table/templates/namesTemplate/namesTemplate.tsx
index 69f8799..7cc69c2 100644
--- a/ui/components/organisms/table/templates/namesTemplate/namesTemplate.tsx
+++ b/ui/components/organisms/table/templates/namesTemplate/namesTemplate.tsx
@@ -18,8 +18,10 @@ const NamesTemplate = ({ data, config }: NamesTemplateProps) => {
const hash = data[config.fields.hash];
const name = data[config.fields.value];
const imgUrl = data[config.fields.url];
+ const link = data[config.fields.redirectLink];
const view = config.view;
const hiddenImg = config.hiddenImg;
+
return (
{!hiddenImg && (
@@ -33,6 +35,7 @@ const NamesTemplate = ({ data, config }: NamesTemplateProps) => {
className={manropeSemiBold.className}
text={hash}
view={view || { sm: 8, md: 12, lg: 14 }}
+ link={link}
>