Skip to content

Commit

Permalink
Merge pull request #230 from GeekGene/fix/profile-popup-data-incorrect
Browse files Browse the repository at this point in the history
Fix/profile popup data incorrect
  • Loading branch information
mattyg authored Sep 11, 2023
2 parents 841efbd + 3885216 commit 515ae86
Show file tree
Hide file tree
Showing 20 changed files with 230 additions and 423 deletions.
45 changes: 27 additions & 18 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion ui/components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ declare module 'vue' {
CreatorsListDialog: typeof import('./src/components/CreatorsListDialog.vue')['default']
EditAgentProfileDialog: typeof import('./src/components/EditAgentProfileDialog.vue')['default']
FollowersListDialog: typeof import('./src/components/FollowersListDialog.vue')['default']
HoloLogin: typeof import('./src/components/HoloLogin.vue')['default']
RandomMewWithTagList: typeof import('./src/components/RandomMewWithTagList.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SearchEverythingDialog: typeof import('./src/components/SearchEverythingDialog.vue')['default']
Expand Down
6 changes: 3 additions & 3 deletions ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,9 @@
"@holochain-open-dev/profiles": "^0.16.1",
"@holochain/client": "^0.15.0",
"@shoelace-style/shoelace": "^2.4.0",
"@tanstack/query-persist-client-core": "^4.33.0",
"@tanstack/query-sync-storage-persister": "^4.33.0",
"@tanstack/vue-query": "^4.34.0",
"@tanstack/query-persist-client-core": "^4.35.0",
"@tanstack/query-sync-storage-persister": "^4.35.0",
"@tanstack/vue-query": "^4.35.2",
"@tauri-apps/api": "^1.4.0",
"async-retry": "^1.3.3",
"dayjs": "^1.11.7",
Expand Down
15 changes: 4 additions & 11 deletions ui/src/components/AgentProfileDetail.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@

<script setup lang="ts">
import { AgentPubKey, AppAgentClient } from "@holochain/client";
import { ComputedRef, inject, watch } from "vue";
import { ComputedRef, computed, inject, watch } from "vue";
import { ProfilesStore } from "@holochain-open-dev/profiles";
import BaseAgentProfileDetail from "@/components/BaseAgentProfileDetail.vue";
import { useQuery } from "@tanstack/vue-query";
Expand All @@ -29,6 +29,7 @@ const props = withDefaults(
const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
.value;
const client = (inject("client") as ComputedRef<AppAgentClient>).value;
const agentPubKeyB64 = computed(() => encodeHashToBase64(props.agentPubKey));
const fetchProfile = async () => {
const profile = await profilesStore.client.getAgentProfile(props.agentPubKey);
Expand All @@ -44,11 +45,7 @@ const {
error: errorProfile,
refetch: refetchProfile,
} = useQuery({
queryKey: [
"profiles",
"getAgentProfile",
encodeHashToBase64(props.agentPubKey),
],
queryKey: ["profiles", "getAgentProfile", agentPubKeyB64],
queryFn: fetchProfile,
refetchOnMount: true,
});
Expand All @@ -67,11 +64,7 @@ const {
error: errorJoinedTimestamp,
refetch: refetchJoinedTimestamp,
} = useQuery({
queryKey: [
"profiles",
"get_joining_timestamp_for_agent",
encodeHashToBase64(props.agentPubKey),
],
queryKey: ["profiles", "get_joining_timestamp_for_agent", agentPubKeyB64],
queryFn: fetchJoinedTimestamp,
refetchOnMount: true,
});
Expand Down
3 changes: 2 additions & 1 deletion ui/src/components/ButtonFollow.vue
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ const myProfile = inject("myProfile") as ComputedRef<Profile>;
const { showMessage, showError } = useToasts();
const showCreateProfileDialog = ref(false);
const agentPubKeyB64 = computed(() => encodeHashToBase64(client.myPubKey));
const fetchMyFollowing = async (): Promise<AgentPubKey[]> =>
client.callZome({
Expand Down Expand Up @@ -72,7 +73,7 @@ const {
queryKey: [
"follows",
"get_creators_for_follower",
encodeHashToBase64(client.myPubKey),
agentPubKeyB64,
"isFollowing",
],
queryFn: fetchMyFollowing,
Expand Down
1 change: 0 additions & 1 deletion ui/src/components/CreateProfileIfNotFoundDialog.vue
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ defineProps<{
}>();
const createProfile = async (profile: Profile) => {
console.log("createPRofile", profile);
await profilesStore.client.createProfile(profile);
await profilesStore.myProfile.reload();
Expand Down
9 changes: 3 additions & 6 deletions ui/src/components/CreatorsListDialog.vue
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@

<script setup lang="ts">
import { AppAgentClient } from "@holochain/client";
import { ComputedRef, inject } from "vue";
import { ComputedRef, computed, inject } from "vue";
import { onBeforeRouteLeave } from "vue-router";
import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
import BaseAgentProfileListItemSkeleton from "@/components/BaseAgentProfileListItemSkeleton.vue";
Expand All @@ -60,6 +60,7 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
.value;
const queryClient = useQueryClient();
const agentPubKeyB64 = computed(() => encodeHashToBase64(props.agentPubKey));
const pageLimit = 10;
Expand Down Expand Up @@ -98,11 +99,7 @@ const fetchCreators = async (params: any) => {
const { data, error, fetchNextPage, hasNextPage, isInitialLoading } =
useInfiniteQuery({
queryKey: [
"mews",
"get_creators_for_follower",
encodeHashToBase64(props.agentPubKey),
],
queryKey: ["mews", "get_creators_for_follower", agentPubKeyB64],
queryFn: fetchCreators,
getNextPageParam: (lastPage) => {
if (lastPage.length === 0) return;
Expand Down
9 changes: 3 additions & 6 deletions ui/src/components/FollowersListDialog.vue
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@

<script setup lang="ts">
import { AppAgentClient } from "@holochain/client";
import { ComputedRef, inject } from "vue";
import { ComputedRef, computed, inject } from "vue";
import { onBeforeRouteLeave } from "vue-router";
import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
import BaseAgentProfileListItemSkeleton from "@/components/BaseAgentProfileListItemSkeleton.vue";
Expand All @@ -60,6 +60,7 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
.value;
const queryClient = useQueryClient();
const agentPubKeyB64 = computed(() => encodeHashToBase64(props.agentPubKey));
const pageLimit = 10;
Expand Down Expand Up @@ -98,11 +99,7 @@ const fetchCreators = async (params: any) => {
const { data, error, fetchNextPage, hasNextPage, isInitialLoading } =
useInfiniteQuery({
queryKey: [
"mews",
"get_followers_for_creator",
encodeHashToBase64(props.agentPubKey),
],
queryKey: ["mews", "get_followers_for_creator", agentPubKeyB64],
queryFn: fetchCreators,
getNextPageParam: (lastPage) => {
if (lastPage.length === 0) return;
Expand Down
108 changes: 108 additions & 0 deletions ui/src/components/RandomMewWithTagList.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
<template>
<BaseList
class="mb-8"
:title="`mews about ${tag}`"
:items="randomMewsWithTag"
:is-loading="isLoadingRandomMewHashesWithTag || isFetchingRandomMewsWithTag"
>
<template #default="{ item }">
<BaseMewListItem
:feed-mew="item"
@mew-deleted="refetchRandomMewsWithTag()"
@mew-licked="refetchRandomMewsWithTag()"
@mew-unlicked="refetchRandomMewsWithTag()"
@mew-pinned="refetchRandomMewsWithTag()"
@mew-unpinned="refetchRandomMewsWithTag()"
@mewmew-created="refetchRandomMewsWithTag()"
@reply-created="refetchRandomMewsWithTag()"
@quote-created="refetchRandomMewsWithTag()"
/>
</template>
<template #loading>
<BaseListSkeleton :count="4">
<BaseMewListItemSkeleton />
</BaseListSkeleton>
</template>
</BaseList>
</template>

<script setup lang="ts">
import { AppAgentClient, ActionHash } from "@holochain/client";
import { ComputedRef, Ref, computed, inject, watch } from "vue";
import { useQuery } from "@tanstack/vue-query";
import { FeedMew } from "@/types/types";
const client = (inject("client") as ComputedRef<AppAgentClient>).value;
const props = defineProps<{
tag: string;
}>();
const tagRef = computed(() => props.tag);
const fetchRandomMewHashesWithTag = (): Promise<ActionHash[]> =>
client.callZome({
role_name: "mewsfeed",
zome_name: "mews",
fn_name: "get_random_mew_hashes_for_tag",
payload: {
tag: props.tag,
count: 3,
},
});
const {
data: randomMewHashesWithTag,
error: errorRandomMewHashesWithTag,
isLoading: isLoadingRandomMewHashesWithTag,
refetch: refetchRandomMewHashesWithTag,
} = useQuery({
queryKey: ["mews", "get_random_mew_hashes_for_tag", tagRef],
queryFn: fetchRandomMewHashesWithTag,
refetchOnWindowFocus: false,
refetchOnMount: false,
refetchOnReconnect: false,
});
watch(errorRandomMewHashesWithTag, console.error);
const hasRandomMewHashesWithTag = computed(() =>
randomMewHashesWithTag.value
? (randomMewHashesWithTag as Ref<ActionHash[]>).value.length > 0
: false
);
const fetchMewsWithContext = async (): Promise<FeedMew[]> =>
client.callZome({
role_name: "mewsfeed",
zome_name: "mews",
fn_name: "get_batch_mews_with_context",
payload: randomMewHashesWithTag.value,
});
const {
data: randomMewsWithTag,
error: errorRandomMewsWithTag,
isFetching: isFetchingRandomMewsWithTag,
refetch: refetchRandomMewsWithTag,
} = useQuery({
queryKey: [
"mews",
"get_random_mew_hashes_for_tag",
tagRef,
"get_batch_mews_with_context",
],
queryFn: fetchMewsWithContext,
enabled: hasRandomMewHashesWithTag,
refetchOnWindowFocus: false,
refetchOnMount: false,
refetchOnReconnect: false,
});
watch(errorRandomMewsWithTag, console.error);
watch(props, () => {
refetchRandomMewHashesWithTag();
});
watch(randomMewHashesWithTag, () => {
refetchRandomMewsWithTag();
});
</script>
9 changes: 5 additions & 4 deletions ui/src/layouts/MainLayout.vue
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,9 @@ import CreateMewInput from "@/components/CreateMewInput.vue";
import BaseSiteMenu from "@/components/BaseSiteMenu.vue";
import SearchEverythingDialog from "@/components/SearchEverythingDialog.vue";
import { ROUTES } from "@/router";
import { FeedMew, MewTypeName, PaginationDirectionName } from "@/types/types";
import { FeedMew, MewTypeName } from "@/types/types";
import { AppAgentClient, encodeHashToBase64 } from "@holochain/client";
import { ComputedRef, inject, ref, watch } from "vue";
import { ComputedRef, computed, inject, ref, watch } from "vue";
import { useRouter, useRoute } from "vue-router";
import { makeUseNotificationsReadStore } from "@/stores/notificationsRead";
import { setHomeRedirect } from "@/utils/homeRedirect";
Expand All @@ -93,6 +93,7 @@ const { setNotificationsCount } = useNotificationsReadStore();
const showSearchDialog = ref(false);
const showCreateMewDialog = ref(false);
const forceReloadRouterViewKey = ref(0);
const myPubKeyB64 = computed(() => encodeHashToBase64(client.myPubKey));
const onCreateMew = () => {
showCreateMewDialog.value = false;
Expand Down Expand Up @@ -126,7 +127,7 @@ const { data: mostRecentMew } = useQuery({
queryKey: [
"mews",
"get_followed_creators_mews_with_context",
encodeHashToBase64(client.myPubKey),
myPubKeyB64,
{ page: { limit: 1 } },
],
queryFn: fetchMostRecentMew,
Expand All @@ -150,7 +151,7 @@ const fetchNotifications = async () => {
};
useInfiniteQuery({
queryKey: ["mews", "count_notifications_for_agent", client.myPubKey],
queryKey: ["mews", "count_notifications_for_agent", myPubKeyB64],
queryFn: fetchNotifications,
refetchInterval: 1000 * 30, // 30 seconds
refetchIntervalInBackground: true,
Expand Down
Loading

0 comments on commit 515ae86

Please sign in to comment.