Merge branch 'main' of https://github.com/PotLock/potlock-nextjs-app …

…into 06042024-testsenv-fix

src/app/_components/AllProjects.tsx

@@ -9,7 +9,7 @@ import Filter, { Group } from "@/common/ui/components/Filter";
 import InfiniteScroll from "@/common/ui/components/InfiniteScroll";
 import SearchBar from "@/common/ui/components/SearchBar";
 import SortSelect from "@/common/ui/components/SortSelect";
-import { UserState } from "@/modules/profile/models";
+import { Profile } from "@/modules/profile/models";
 
 import Card from "../../modules/project/components/Card";
 import { categories, statuses } from "../../modules/project/constants";
@@ -76,20 +76,20 @@ const AllProjects = () => {
     }
   };
 
-  const registrationsProfile = useTypedSelector((state) => state.users);
+  const registrationsProfile = useTypedSelector((state) => state.profiles);
 
   // handle search & filter
   useEffect(() => {
     // Search
-    const handleSearch = (registration: Registration, user: UserState) => {
+    const handleSearch = (registration: Registration, profile: Profile) => {
       if (search === "") return true;
       const { registrant_id: registrantId } = registration;
-      const { profile, tags, team } = user || {};
+      const { socialData, tags, team } = profile || {};
       // registration fields to search in
       const fields = [
         registrantId,
-        profile?.description,
-        profile?.name,
+        socialData?.description,
+        socialData?.name,
         tags?.join(" "),
         team?.join(" "),
       ];
@@ -104,27 +104,33 @@ const AllProjects = () => {
       return statusFilter.includes(registration.status);
     };
     // Filter by registration category
-    const handleCategory = (user: UserState) => {
-      const tags = user.tags || [];
+    const handleCategory = (profile: Profile) => {
+      const tags = profile.tags || [];
 
       if (categoryFilter.length === 0) return true;
       return categoryFilter.some((tag: string) => tags.includes(tag));
     };
 
     if (search || categoryFilter.length || statusFilter.length) {
       const filteredRegistrations = registrations.filter((registration) => {
-        const user = registrationsProfile[registration.registrant_id] || {};
+        const profile = registrationsProfile[registration.registrant_id] || {};
 
         return (
-          handleSearch(registration, user) &&
-          handleCategory(user) &&
+          handleSearch(registration, profile) &&
+          handleCategory(profile) &&
           handleStatus(registration)
         );
       });
 
       setFilteredRegistrations(filteredRegistrations);
     }
-  }, [search, categoryFilter, statusFilter, registrations]);
+  }, [
+    search,
+    categoryFilter,
+    statusFilter,
+    registrations,
+    registrationsProfile,
+  ]);
 
   // Fetch Registrations
   useEffect(() => {

src/app/_components/UserDropdown.tsx

@@ -20,8 +20,8 @@ import { Skeleton } from "@/common/ui/components/skeleton";
 import useWallet from "@/modules/auth/hooks/useWallet";
 import { statusesIcons } from "@/modules/core/constants";
 import useRegistration from "@/modules/core/hooks/useRegistration";
-import { fetchProfileImages } from "@/modules/core/services/fetchProfileImages";
-import { DEFAULT_USER } from "@/modules/profile/constants";
+import { fetchSocialImages } from "@/modules/core/services/socialImages";
+import { PROFILE_DEFAULTS } from "@/modules/profile/constants";
 import {
   updateAccountId,
   updateNadabotVerification,
@@ -46,7 +46,7 @@ const UserDropdown = () => {
 
   useEffect(() => {
     const fetchProfileImage = async () => {
-      const { image, profile } = await fetchProfileImages({
+      const { image, profile } = await fetchSocialImages({
         accountId,
       });
       setProfileImg(image);
@@ -83,7 +83,7 @@ const UserDropdown = () => {
       width={size}
       height={size}
       onError={() => {
-        setProfileImg(DEFAULT_USER.profileImages.image);
+        setProfileImg(PROFILE_DEFAULTS.socialImages.image);
       }}
       className="rounded-full shadow-[0px_0px_0px_1px_rgba(199,199,199,0.22)_inset]"
       alt="profile-image"

src/app/_store/models.ts

@@ -1,12 +1,16 @@
 import { Models } from "@rematch/core";
 
 import { auth } from "@/modules/auth/state";
-import { navModel, usersModel } from "@/modules/profile/models";
+import { navModel, profilesModel } from "@/modules/profile/models";
 
 export interface RootModel extends Models<RootModel> {
   auth: typeof auth;
-  users: typeof usersModel;
+  profiles: typeof profilesModel;
   nav: typeof navModel;
 }
 
-export const models: RootModel = { auth, users: usersModel, nav: navModel };
+export const models: RootModel = {
+  auth,
+  profiles: profilesModel,
+  nav: navModel,
+};

src/common/contracts/social/index.ts

@@ -112,7 +112,7 @@ type NEARSocialGetResponse = {
  * Get User Profile Info from NEAR Social DB
  * @returns
  */
-export const getUserProfile = async (input: { accountId: string }) => {
+export const getSocialProfile = async (input: { accountId: string }) => {
   const response = await nearSocialDbContractApi.view<
     NEARSocialUserProfileInput,
     NEARSocialGetResponse

src/common/lib/images.ts

@@ -1,5 +1,5 @@
 import { naxiosInstance } from "@/common/contracts/index";
-import { Image, getUserProfile } from "@/common/contracts/social";
+import { Image, getSocialProfile } from "@/common/contracts/social";
 
 type Props = {
   accountId?: string;
@@ -41,7 +41,7 @@ export const getImage = async ({
 
   try {
     if (!socialImage && accountId) {
-      const profile = await getUserProfile({ accountId });
+      const profile = await getSocialProfile({ accountId });
       if (!profile) return console.log("error fetching social profile");
 
       socialImage = profile[type || "image"];

src/modules/core/services/fetchProfileImages.ts → src/modules/core/services/socialImages.ts

@@ -1,11 +1,11 @@
 import {
   NEARSocialUserProfile,
-  getUserProfile,
+  getSocialProfile,
 } from "@/common/contracts/social";
 import { getImage } from "@/common/lib/images";
 
 type Props = {
-  profile?: NEARSocialUserProfile;
+  socialData?: NEARSocialUserProfile;
   accountId: string;
 };
 
@@ -14,11 +14,11 @@ type Props = {
  * @param
  * @returns
  */
-export const fetchProfileImages = async ({ profile, accountId }: Props) => {
-  let currentProfile = profile;
+export const fetchSocialImages = async ({ socialData, accountId }: Props) => {
+  let currentProfile = socialData;
 
   if (!currentProfile) {
-    currentProfile = await getUserProfile({ accountId });
+    currentProfile = await getSocialProfile({ accountId });
   }
 
   const image = getImage({

src/modules/profile/components/ProfileBanner.tsx

@@ -13,7 +13,7 @@ import {
 import { Skeleton } from "@/common/ui/components/skeleton";
 import useIsHuman from "@/modules/core/hooks/useIsHuman";
 import useRegistration from "@/modules/core/hooks/useRegistration";
-import { fetchProfileImages } from "@/modules/core/services/fetchProfileImages";
+import { fetchSocialImages } from "@/modules/core/services/socialImages";
 import { projectStatusIcons } from "@/modules/project/components/ProjectStatusIcons";
 
 import FollowStats from "./FollowStats";
@@ -37,7 +37,10 @@ const ProfileBanner = (props: Props) => {
 
   useEffect(() => {
     (async () => {
-      const imagesData = await fetchProfileImages({ profile, accountId });
+      const imagesData = await fetchSocialImages({
+        socialData: profile,
+        accountId,
+      });
 
       setProfileImages({
         image: imagesData.image,

src/modules/profile/constants.ts

@@ -1,8 +1,12 @@
-export const DEFAULT_USER = {
-  profile: {},
+import { Profile } from "./models";
+
+export const PROFILE_DEFAULTS: Profile = {
+  socialData: {},
   tags: [],
+  team: [],
   totalAmountNear: "",
-  profileImages: {
+
+  socialImages: {
     image: "/assets/images/profile-image.png",
     backgroundImage: "/assets/images/profile-banner.png",
   },

src/modules/profile/models.ts

@@ -6,41 +6,43 @@ import { PayoutDetailed } from "@/common/contracts/potlock/interfaces/pot.interf
 import { getDonationsForProject } from "@/common/contracts/potlock/pot";
 import {
   NEARSocialUserProfile,
-  getUserProfile,
+  getSocialProfile,
 } from "@/common/contracts/social";
 import { yoctosToUsdWithFallback } from "@/common/lib";
 
-import { fetchProfileImages } from "../core/services/fetchProfileImages";
+import { fetchSocialImages } from "../core/services/socialImages";
 import {
   getTagsFromSocialProfileData,
   getTeamMembersFromProfile,
   getTotalAmountNear,
 } from "../project/utils";
 
-export type UserState = {
-  profile: NEARSocialUserProfile;
+export type Profile = {
+  socialData: NEARSocialUserProfile;
   tags: string[];
   team: string[];
   totalAmountNear: string;
-  profileImages: {
+
+  socialImages: {
     image: string;
     backgroundImage: string;
   };
 };
-type Users = Record<string, UserState>;
 
-export const usersModel = createModel<RootModel>()({
-  state: {} as Users,
+type ProfileIndex = Record<string, Profile>;
+
+export const profilesModel = createModel<RootModel>()({
+  state: {} as ProfileIndex,
   reducers: {
-    update(state, payload: Users) {
+    update(state, payload: ProfileIndex) {
       return {
         ...state,
         ...payload,
       };
     },
   },
   effects: {
-    async loadUser({
+    async loadProfile({
       projectId,
       potId,
       payoutDetails,
@@ -49,12 +51,12 @@ export const usersModel = createModel<RootModel>()({
       potId?: string;
       payoutDetails?: PayoutDetailed;
     }) {
-      const profile = await getUserProfile({
+      const socialData = await getSocialProfile({
         accountId: projectId,
       });
 
-      const profileImagesPromise = fetchProfileImages({
-        profile,
+      const socialImagesResponse = fetchSocialImages({
+        socialData,
         accountId: projectId,
       });
 
@@ -70,29 +72,24 @@ export const usersModel = createModel<RootModel>()({
               })
             : Promise.resolve([]);
 
-      const [profileImages, donations] = await Promise.all([
-        profileImagesPromise,
+      const [socialImages, donations] = await Promise.all([
+        socialImagesResponse,
         donationsPromise,
       ]);
 
       const totalAmountNear = await yoctosToUsdWithFallback(
         getTotalAmountNear(donations, potId, payoutDetails),
       );
 
-      const tags = getTagsFromSocialProfileData(profile || {});
-      const team = getTeamMembersFromProfile(profile);
-
-      const user = {
-        [projectId]: {
-          profile: profile ?? {},
-          tags,
-          team,
-          totalAmountNear,
-          profileImages,
-        },
+      const profile: Profile = {
+        socialData: socialData ?? {},
+        tags: getTagsFromSocialProfileData(socialData || {}),
+        team: getTeamMembersFromProfile(socialData),
+        totalAmountNear,
+        socialImages,
       };
 
-      this.update(user);
+      this.update({ [projectId]: profile });
     },
   },
 });
@@ -123,7 +120,7 @@ const updateList = (list: string[], item: string): string[] => {
 
 export const navModel = createModel<RootModel>()({
   state: {
-    // TODO: add is registery admin
+    // TODO: add is registry admin
     accountId: "",
     isNadabotVerified: false,
     actAsDao: {

src/modules/profile/utils/index.ts

@@ -1,9 +1,10 @@
 import { dispatch, useTypedSelector } from "@/app/_store";
 
-import { DEFAULT_USER } from "../constants";
+import { PROFILE_DEFAULTS } from "../constants";
+import { Profile } from "../models";
 
-export const useUser = (projectId: string) =>
-  useTypedSelector((state) => state.users[projectId] || DEFAULT_USER);
+export const useProfile = (projectId: string): Profile =>
+  useTypedSelector((state) => state.profiles[projectId] || PROFILE_DEFAULTS);
 
 export const toggleDao = (toggle: boolean) =>
   dispatch.nav.update({