Merge pull request #207 from SpaceTurtle-Dao/fix/state

Fix/state
SpaceTurtle-Dao · Feb 24, 2025 · 2a425e2 · 2a425e2
2 parents 45c597a + 5751a0e
commit 2a425e2
Show file tree

Hide file tree

Showing 31 changed files with 1,021 additions and 1,358 deletions.
diff --git a/package.json b/package.json
@@ -33,6 +33,7 @@
   },
   "dependencies": {
     "@permaweb/aoconnect": "^0.0.59",
+    "@permaweb/aoprofile": "^0.0.9",
     "@sveltejs/kit": "^2.16.1",
     "ao-tokens": "^0.0.4",
     "arweave": "^1.15.1",

diff --git a/src/App.svelte b/src/App.svelte
@@ -9,20 +9,21 @@
   import Right from "$lib/components/views/main/RightView.svelte";
   import SignUp from "./lib/components/views/signup/SignUp.svelte";
   import { addressStore } from "$lib/stores/address.store";
-  import { currentUser } from "$lib/stores/current-user.store";
   import Feed from "$lib/components/views/feed/Feed.svelte";
   import Profile from "$lib/components/views/profile/Profile.svelte";
   import IndividualPost from "$lib/components/posts/IndividualPost.svelte";
   import MessagesPage from "$lib/components/Messages/MessagesPage.svelte";
   import MobileTopView from "$lib/components/views/main/MobileTopView.svelte";
   import MobileBottomNavBar from "$lib/components/views/main/MobileBottomNavBar.svelte";
+  import { postService } from "$lib/services/PostService";
+  import { profileService } from "$lib/services/ProfileService";
 
-  let isLoading = true;
-  let isFollowListAlreadyFetched = false;
-  let initialRoute = window.location.hash.slice(1) || "/";
+  let isLoading = false;
+  //let isFollowListAlreadyFetched = false;
+  //let initialRoute = window.location.hash.slice(1) || "/";
 
   const routes = {
-    "/": LandingPage,
+    "/": Feed,
     "/feed": Feed,
     "/profile": Profile,
     "/messages": MessagesPage,
@@ -32,76 +33,24 @@
     "/test": MobileTopView,
   };
 
-  // Store the current route in sessionStorage when it changes
-  $: if ($location) {
-    sessionStorage.setItem("lastRoute", $location);
-  }
-
   onMount(async () => {
-    // Check if there's a stored route
-    const storedRoute = sessionStorage.getItem("lastRoute");
-    if (storedRoute) {
-      initialRoute = storedRoute;
-    }
-
-    try {
-      await addressStore.sync();
-
-      if ($addressStore.address) {
-        await currentUser.fetch();
-        if ($currentUser) {
-          // Only restore the route if user is authenticated
-          if (storedRoute && storedRoute !== "/") {
-            push(storedRoute);
-          }
-        }
-      }
-    } catch (error) {
-      console.error("Error during initialization:", error);
-    } finally {
-      isLoading = false;
-    }
-  });
-
-  addressStore.subscribe(async ({ address }) => {
-    if (address) {
-      try {
-        console.log("Fetching User");
-        await currentUser.fetch();
-        isLoading = false;
-        console.log("Got User");
-      } catch (error) {
-        console.error("Error fetching current user:", error);
-      } finally {
-        isLoading = false;
-      }
+    console.log("getting connected status")
+    let isConnected = await addressStore.isConnected()
+    console.log("got status")
+    if (isConnected && $addressStore.address){
+      profileService.get($addressStore.address)
     }
   });
 </script>
 
-{#if isLoading}
-  <div class="flex items-center justify-center h-screen bg-background">
-    <div class="space-y-4">
-      <Spinner />
-      <p class="text-muted-foreground text-center animate-pulse">
-        Connecting to wallet...
-      </p>
-    </div>
-  </div>
-{:else if !$currentUser && $location !== "/signup"}
-  <LandingPage />
-{:else if $location === "/signup"}
-  <Router {routes} />
-{:else if $currentUser}
-  <div class="bg-background">
-    <MobileTopView />
-    <div class="flex w-full bg-background justify-center">
-      <Left />
-      <Middle>
-        <Router {routes} />
-      </Middle>
-      <Right />
-    </div>
-    <MobileBottomNavBar />
+<div class="bg-background">
+  <MobileTopView />
+  <div class="flex w-full bg-background justify-center">
+    <Left />
+    <Middle>
+      <Router {routes} />
+    </Middle>
+    <Right />
   </div>
-{/if}
+  <MobileBottomNavBar />
+</div>
diff --git a/src/lib/ao/process.svelte b/src/lib/ao/process.svelte
@@ -10,11 +10,7 @@
 
 	// @ts-ignore
 	const { result, results, message, spawn, monitor, unmonitor, dryrun } =
-		connect({
-			MU_URL: "https://mu.ao-testnet.xyz",
-			CU_URL: "https://cu.ao-testnet.xyz",
-			GATEWAY_URL: "https://arweave.net",
-		});
+		connect();
 
 	// @ts-ignore
 	export async function send(processId, tags, data: string | null) {

diff --git a/src/lib/ao/relay.ts b/src/lib/ao/relay.ts
@@ -5,9 +5,10 @@ import { FetchEvents } from "$lib/ao/messegeFactory.svelte";
 import { HUB_ID } from "$lib/constants";
 import type { Tag } from "$lib/models/Tag";
 import type { Profile } from "$lib/models/Profile";
-import type { profile } from "console";
+import { addressStore } from "$lib/stores/address.store";
 
 export const event = async (tags: Array<Tag>) => {
+  await addressStore.connectWallet();
   const actionTag: Tag = {
     name: "Action",
     value: "Event",
@@ -57,8 +58,8 @@ export const fetchProfile = async (address: string): Promise<Profile> => {
   try {
     // messages[0] give the latest profile change of this address and it  return that
     let message = messages[0];
+    if (!message) throw("message is empty");
     let profile = JSON.parse(message.Content);
-
     profile.address = message.From;
     profile.created_at = messages[0].Timestamp;
     profile.updated_at = message.Timestamp;

diff --git a/src/lib/components/Follow/Follow.svelte b/src/lib/components/Follow/Follow.svelte
@@ -1,16 +1,14 @@
 <script lang="ts">
   import ButtonWithLoader from "../ButtonWithLoader/ButtonWithLoader.svelte";
   import { currentUser } from "$lib/stores/current-user.store";
+  import { onMount } from "svelte";
+  import { profileService } from "$lib/services/ProfileService";
+  import { addressStore } from "$lib/stores/address.store";
 
   export let address: string;
 
   // let isSubscribed: boolean = $followListStore.has(address);
-  let isSubscribed: boolean = false;
-
-  currentUser.subscribe((_currentUser) => {
-    isSubscribed = _currentUser.followList.includes(address);
-  });
-
+  let isSubscribed: boolean;
   let loader = false;
 
   async function unsubscribe() {
@@ -24,26 +22,33 @@
     await currentUser.follow(address);
     loader = false;
   }
+  onMount(async () => {
+    if (!$addressStore.address) return;
+    let profile = await profileService.get($addressStore.address);
+    isSubscribed = profile.followList.includes(address);
+  });
 </script>
 
-{#if isSubscribed}
-  <ButtonWithLoader
-    {loader}
-    class="group text-sm font-bold h-8 w-[120px]  rounded-full text-primary  hover:border-red-800 border-input bg-background hover:bg-accent hover:text-accent-foreground border"
-    loaderClass="size-5"
-    on:click={unsubscribe}
-    disabled={loader}
-  >
-    <span class="group-hover:hidden">Subscribed</span>
-    <span class="hidden group-hover:block text-red-500">Unsubscribe </span>
-  </ButtonWithLoader>
-{:else}
-  <ButtonWithLoader
-    {loader}
-    class="group text-sm font-bold h-8 w-[102px] rounded-full"
-    loaderClass="size-5"
-    on:click={subscribe}
-    disabled={loader}
-    >Subscribe
-  </ButtonWithLoader>
+{#if $addressStore.address}
+  {#if isSubscribed}
+    <ButtonWithLoader
+      {loader}
+      class="group text-sm font-bold h-8 w-[120px]  rounded-full text-primary  hover:border-red-800 border-input bg-background hover:bg-accent hover:text-accent-foreground border"
+      loaderClass="size-5"
+      on:click={unsubscribe}
+      disabled={loader}
+    >
+      <span class="group-hover:hidden">Subscribed</span>
+      <span class="hidden group-hover:block text-red-500">Unsubscribe </span>
+    </ButtonWithLoader>
+  {:else}
+    <ButtonWithLoader
+      {loader}
+      class="group text-sm font-bold h-8 w-[102px] rounded-full"
+      loaderClass="size-5"
+      on:click={subscribe}
+      disabled={loader}
+      >Subscribe
+    </ButtonWithLoader>
+  {/if}
 {/if}
diff --git a/src/lib/components/Sidebar/UserMenu.svelte b/src/lib/components/Sidebar/UserMenu.svelte
@@ -5,23 +5,26 @@
        import { profileFromEvent, type Profile } from "$lib/models/Profile";
        import { addressStore } from "$lib/stores/address.store";
        import { currentUser } from "$lib/stores/profile.store";
+       import { onMount } from "svelte";
        import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
+       import { profileService } from "$lib/services/ProfileService";
 
        // import {}
 
        let profile: Profile;
 
-       currentUser.subscribe((value) => {
-              profile = profileFromEvent(value.Profile);
-       });
-
        function toUrl(tx: string) {
               return ARWEAVE_ADDRESS + tx;
        }
 
        async function diconnectWallet() {
               await addressStore.disconnectWallet();
        }
+
+       onMount(async () => {
+              if (!$addressStore.address) return;
+              profile = await profileService.get($addressStore.address);
+       });
 </script>
 
 <DropdownMenu.Root>

diff --git a/src/lib/components/UserList/Users.svelte b/src/lib/components/UserList/Users.svelte
@@ -5,11 +5,11 @@
   import type { Profile } from "$lib/models/Profile";
   import { onMount } from "svelte";
   import { profileService } from "$lib/services/ProfileService";
+  import { addressStore } from "$lib/stores/address.store";
 
-  export let _profiles: string[] = [];
+  export let addresss: string[] = [];
   const ITEMS_PER_PAGE = 100;
   let since = 0;
-  let profiles: Profile[] = [];
   let containerRef: HTMLDivElement;
   let loading = false;
   let hasMore = true;
@@ -18,35 +18,29 @@
     loadInitialProfiles();
   });
 
-  profileService.subscribe(value => {
+  /*profileService.subscribe(value => {
     profiles = value.values().toArray()
-  })
+  })*/
 
   async function loadInitialProfiles() {
-    console.log("follow list");
+    /*console.log("follow list");
     console.log(_profiles);
-    profileService.fetchProfiles(
-      since,
-      ITEMS_PER_PAGE,
-      _profiles,
-    );
-    console.log(profiles.length);
+    profiles = (await profileService.fetchProfiles(0, 1000, _profiles))
+      .values()
+      .toArray();
+    console.log(profiles.length);*/
   }
 
   async function loadMoreProfiles() {
-    if (loading || !hasMore) return;
+    /*if (loading || !hasMore) return;
     console.log("follow list");
     console.log(_profiles);
-    profileService.fetchProfiles(
-      since,
-      ITEMS_PER_PAGE,
-      _profiles,
-    );
-    hasMore = profiles.length === ITEMS_PER_PAGE;
+    profileService.fetchProfiles(since, ITEMS_PER_PAGE, _profiles);
+    hasMore = profiles.length === ITEMS_PER_PAGE;*/
   }
 
   function handleScroll(event: Event) {
-    const target = event.target as HTMLDivElement;
+    /*const target = event.target as HTMLDivElement;
     const threshold = 100; // pixels from bottom to trigger load
 
     if (
@@ -62,32 +56,26 @@
         since = profiles[profiles.length - 1].created_at;
         loadMoreProfiles();
       }
-    }
+    }*/
   }
 </script>
 
-{#if profiles.length > 0}
+{#if addresss.length > 0}
   <div class="w-full h-full">
     <Card.Root
       data-x-chunk-name="UserList"
       data-x-chunk-description="A card showing a list of users."
       class="border-border rounded p-0 min-w-[280px]"
     >
-      {#if _profiles.length == 0}
-        <Card.Header>
-          <Card.Title>You might like</Card.Title>
-        </Card.Header>
-      {/if}
-
       <Card.Content class="w-full pt-5">
         <div
           bind:this={containerRef}
           on:scroll={handleScroll}
           class="grid gap-4 lg:gap-6 max-h-[60vh] lg:max-h-[80vh] overflow-y-auto scrollable-element pr-2 lg:pr-3"
         >
-          {#each profiles as profile}
-            {#if profile.address !== $currentUser.address}
-              <ProfileCard {profile} />
+          {#each addresss as address}
+            {#if address !== $addressStore.address}
+              <ProfileCard {address} />
             {/if}
           {/each}
 

diff --git a/src/lib/components/UserProfile/ProfileHoverCard.svelte b/src/lib/components/UserProfile/ProfileHoverCard.svelte
@@ -6,21 +6,21 @@
   import { onMount } from "svelte";
   import type { Profile } from "$lib/models/Profile";
   import Follow from "../Follow/Follow.svelte";
-  import { currentUser } from "$lib/stores/current-user.store";
   import { fetchFollowList } from "$lib/ao/relay";
   import { Skeleton } from "$lib/components/ui/skeleton";
+    import { addressStore } from "$lib/stores/address.store";
 
   export let profile: Profile;
 
   let numberOfFollowing = 0;
 
-  let isCurrentUser = $currentUser.address === profile.address;
+  let isCurrentUser = $addressStore.address === profile.address;
 
   let followListLoading = false;
 
   onMount(() => {
     if (isCurrentUser) {
-      numberOfFollowing = $currentUser.followList.length;
+      numberOfFollowing = profile.followList.length;
     } else {
       followListLoading = true;
       fetchFollowList(profile.address)