Merge pull request #204 from GeekGene/fix/hide-passive-errors

Only show errors toasts for active user actions

ui/src/components/CreatorsListDialog.vue

@@ -44,7 +44,6 @@ import BaseAgentProfileListItemSkeleton from "@/components/BaseAgentProfileListI
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseAgentProfileList from "@/components/BaseAgentProfileList.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import { ProfilesStore } from "@holochain-open-dev/profiles";
 import { encodeHashToBase64 } from "@holochain/client";
 import { AgentProfile } from "@/types/types";
@@ -61,7 +60,6 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
   .value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -119,7 +117,7 @@ const fetchNextPageInfiniteScroll = async (
   done(hasNextPage?.value);
 };
 
-watch(error, showError);
+watch(error, console.error);
 
 onBeforeRouteLeave(() => {
   if (data.value && data.value.pages.length > 1) {

ui/src/components/FollowersListDialog.vue

@@ -44,7 +44,6 @@ import BaseAgentProfileListItemSkeleton from "@/components/BaseAgentProfileListI
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseAgentProfileList from "@/components/BaseAgentProfileList.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import { ProfilesStore } from "@holochain-open-dev/profiles";
 import { encodeHashToBase64 } from "@holochain/client";
 import { AgentProfile } from "@/types/types";
@@ -61,7 +60,6 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
   .value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -119,7 +117,7 @@ const fetchNextPageInfiniteScroll = async (
   done(hasNextPage?.value);
 };
 
-watch(error, showError);
+watch(error, console.error);
 
 onBeforeRouteLeave(() => {
   if (data.value && data.value.pages.length > 1) {

ui/src/pages/AgentProfile.vue

@@ -133,7 +133,6 @@
 
 <script setup lang="ts">
 import { AgentProfile } from "@/types/types";
-import { useToasts } from "@/stores/toasts";
 import {
   AgentPubKey,
   decodeHashFromBase64,
@@ -156,7 +155,6 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const route = useRoute();
 const router = useRouter();
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const agentPubKey = computed(() =>
   decodeHashFromBase64(route.params.agentPubKey as string)
@@ -193,7 +191,7 @@ const {
   ],
   queryFn: fetchAuthoredMews,
 });
-watch(errorAuthoredMews, showError);
+watch(errorAuthoredMews, console.error);
 
 const fetchPinnedMews = () =>
   client.callZome({
@@ -216,7 +214,7 @@ const {
   ],
   queryFn: fetchPinnedMews,
 });
-watch(errorPinnedMews, showError);
+watch(errorPinnedMews, console.error);
 
 const fetchProfileWithContext = async () => {
   const profile = await profilesStore.client.getAgentProfile(agentPubKey.value);
@@ -250,7 +248,7 @@ const {
   ],
   queryFn: fetchProfileWithContext,
 });
-watch(errorProfile, showError);
+watch(errorProfile, console.error);
 
 const fetchFollowers = async () => {
   const agents: AgentPubKey[] = await client.callZome({
@@ -288,7 +286,7 @@ const { data: followers, error: errorFollowers } = useQuery({
   ],
   queryFn: fetchFollowers,
 });
-watch(errorFollowers, showError);
+watch(errorFollowers, console.error);
 
 const fetchCreators = async () => {
   const agents: AgentPubKey[] = await client.callZome({
@@ -326,7 +324,7 @@ const { data: creators, error: errorCreators } = useQuery({
   ],
   queryFn: fetchCreators,
 });
-watch(errorCreators, showError);
+watch(errorCreators, console.error);
 
 const fetchCreatorsCount = async (): Promise<number> =>
   client.callZome({
@@ -344,7 +342,7 @@ const { data: creatorsCount, error: errorCreatorsCount } = useQuery({
   ],
   queryFn: fetchCreatorsCount,
 });
-watch(errorCreatorsCount, showError);
+watch(errorCreatorsCount, console.error);
 
 const fetchFollowersCount = async (): Promise<number> =>
   client.callZome({
@@ -366,5 +364,5 @@ const {
   ],
   queryFn: fetchFollowersCount,
 });
-watch(errorFollowersCount, showError);
+watch(errorFollowersCount, console.error);
 </script>

ui/src/pages/DiscoverCreators.vue

@@ -134,14 +134,12 @@ import { AppAgentClient } from "@holochain/client";
 import BaseList from "@/components/BaseList.vue";
 import { FeedMew } from "@/types/types";
 import { useQuery } from "@tanstack/vue-query";
-import { useToasts } from "@/stores/toasts";
 import IconDiceOutline from "~icons/ion/dice-outline";
 import { ActionHash } from "@holochain/client";
 import BaseListSkeleton from "@/components/BaseListSkeleton.vue";
 import BaseMewListItemSkeleton from "@/components/BaseMewListItemSkeleton.vue";
 
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
-const { showError } = useToasts();
 
 const fetchRandomMewHashes = (): Promise<ActionHash[]> =>
   client.callZome({
@@ -171,7 +169,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewHashes, showError);
+watch(errorRandomMewHashes, console.error);
 
 const hasRandomMewHashes = computed(
   () => randomMewHashes.value !== undefined && randomMewHashes.value.length > 0
@@ -191,7 +189,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMews, showError);
+watch(errorRandomMews, console.error);
 
 const fetchRandomTags = (): Promise<string[]> => {
   return client.callZome({
@@ -214,7 +212,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomTags, showError);
+watch(errorRandomTags, console.error);
 
 onMounted(async () => {
   if (randomMews.value === undefined || randomMews.value.length === 0) {
@@ -270,7 +268,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewHashesWithTag1, showError);
+watch(errorRandomMewHashesWithTag1, console.error);
 const hasRandomMewHashesWithTag1 = computed(
   () =>
     tag1Enabled.value &&
@@ -298,7 +296,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewsWithTag1, showError);
+watch(errorRandomMewsWithTag1, console.error);
 
 // Random Mews with Tag 2
 
@@ -315,7 +313,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewHashesWithTag2, showError);
+watch(errorRandomMewHashesWithTag2, console.error);
 const hasRandomMewHashesWithTag2 = computed(
   () =>
     tag2Enabled.value &&
@@ -343,7 +341,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewsWithTag2, showError);
+watch(errorRandomMewsWithTag2, console.error);
 
 // Random Mews with Tag 3
 
@@ -360,7 +358,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewHashesWithTag3, showError);
+watch(errorRandomMewHashesWithTag3, console.error);
 const hasRandomMewHashesWithTag3 = computed(
   () =>
     tag3Enabled.value &&
@@ -388,7 +386,7 @@ const {
   refetchOnMount: false,
   refetchOnReconnect: false,
 });
-watch(errorRandomMewsWithTag3, showError);
+watch(errorRandomMewsWithTag3, console.error);
 
 const shuffle = async () => {
   await refetchMews();

ui/src/pages/MewYarn.vue

@@ -62,7 +62,6 @@ import { decodeHashFromBase64 } from "@holochain/client";
 import { ComputedRef, computed, inject, watch } from "vue";
 import { useRoute, onBeforeRouteLeave } from "vue-router";
 import { AppAgentClient } from "@holochain/client";
-import { useToasts } from "@/stores/toasts";
 import {
   useInfiniteQuery,
   useQuery,
@@ -75,7 +74,6 @@ import BaseInfiniteScroll from "@/components/BaseInfiniteScroll.vue";
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const route = useRoute();
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -103,7 +101,7 @@ const {
   enabled: hasActionHash,
   refetchInterval: 1000 * 60 * 2, // 2 minutes
 });
-watch(mewError, showError);
+watch(mewError, console.error);
 
 const fetchReplies = (params: any) =>
   client.callZome({
@@ -146,7 +144,7 @@ const {
   refetchInterval: 1000 * 60 * 2, // 2 minutes
   refetchOnMount: true,
 });
-watch(errorReplies, showError);
+watch(errorReplies, console.error);
 
 const fetchNextPageReplies = async (done: (hasMore?: boolean) => void) => {
   await fetchNextPage();
@@ -164,7 +162,6 @@ const refetchRepliesPage = async (pageIndex: number) => {
   });
 };
 
-
 onBeforeRouteLeave(() => {
   if (replies.value && replies.value.pages.length > 1) {
     queryClient.setQueryData(

ui/src/pages/MewsFeed.vue

@@ -58,7 +58,6 @@ import { AppAgentClient, encodeHashToBase64 } from "@holochain/client";
 import { ComputedRef, inject, watch } from "vue";
 import { FeedMew, PaginationDirectionName } from "@/types/types";
 import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
-import { useToasts } from "@/stores/toasts";
 import BaseMewListItem from "@/components/BaseMewListItem.vue";
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseListSkeleton from "@/components/BaseListSkeleton.vue";
@@ -68,7 +67,6 @@ import { onBeforeRouteLeave } from "vue-router";
 
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 const pageLimit = 10;
 
 const fetchMewsFeed = (params: any): Promise<FeedMew[]> =>
@@ -103,7 +101,7 @@ const { data, error, fetchNextPage, hasNextPage, isInitialLoading, refetch } =
     refetchInterval: 1000 * 60 * 2, // 2 minutes
     refetchOnMount: true,
   });
-watch(error, showError);
+watch(error, console.error);
 
 const fetchNextPageInfiniteScroll = async (
   done: (hasMore?: boolean) => void

ui/src/pages/MewsListAuthor.vue

@@ -73,7 +73,6 @@ import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseMewListItem from "@/components/BaseMewListItem.vue";
 import BaseAgentProfileLinkName from "@/components/BaseAgentProfileLinkName.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import { ProfilesStore } from "@holochain-open-dev/profiles";
 import { decodeHashFromBase64 } from "@holochain/client";
 import BaseButtonBack from "@/components/BaseButtonBack.vue";
@@ -86,7 +85,6 @@ const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const profilesStore = (inject("profilesStore") as ComputedRef<ProfilesStore>)
   .value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -144,8 +142,8 @@ const fetchNextPageInfiniteScroll = async (
   done(hasNextPage?.value);
 };
 
-watch(error, showError);
-watch(errorProfile, showError);
+watch(error, console.error);
+watch(errorProfile, console.error);
 
 onBeforeRouteLeave(() => {
   if (data.value && data.value.pages.length > 1) {

ui/src/pages/MewsListCashtag.vue

@@ -61,7 +61,6 @@ import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseMewListItem from "@/components/BaseMewListItem.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import BaseButtonBack from "@/components/BaseButtonBack.vue";
 import BaseInfiniteScroll from "@/components/BaseInfiniteScroll.vue";
 import BaseListSkeleton from "@/components/BaseListSkeleton.vue";
@@ -70,7 +69,6 @@ import BaseMewListItemSkeleton from "@/components/BaseMewListItemSkeleton.vue";
 const route = useRoute();
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 const pageLimit = 5;
 
 const fetchCashtagMews = async (params: any) =>
@@ -104,7 +102,7 @@ const { data, error, fetchNextPage, hasNextPage, isInitialLoading, refetch } =
     refetchInterval: 1000 * 60 * 2, // 2 minutes
     refetchOnMount: true,
   });
-watch(error, showError);
+watch(error, console.error);
 
 const fetchNextPageInfiniteScroll = async (
   done: (hasMore?: boolean) => void

ui/src/pages/MewsListHashtag.vue

@@ -61,7 +61,6 @@ import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseMewListItem from "@/components/BaseMewListItem.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import BaseButtonBack from "@/components/BaseButtonBack.vue";
 import BaseListSkeleton from "@/components/BaseListSkeleton.vue";
 import BaseMewListItemSkeleton from "@/components/BaseMewListItemSkeleton.vue";
@@ -70,7 +69,6 @@ import BaseInfiniteScroll from "@/components/BaseInfiniteScroll.vue";
 const route = useRoute();
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -107,7 +105,7 @@ const { data, error, fetchNextPage, hasNextPage, isInitialLoading, refetch } =
     refetchInterval: 1000 * 60 * 2, // 2 minutes
     refetchOnMount: true,
   });
-watch(error, showError);
+watch(error, console.error);
 
 const fetchNextPageInfiniteScroll = async (
   done: (hasMore?: boolean) => void

ui/src/pages/MewsListMention.vue

@@ -61,7 +61,6 @@ import { useInfiniteQuery, useQueryClient } from "@tanstack/vue-query";
 import BaseEmptyList from "@/components/BaseEmptyList.vue";
 import BaseMewListItem from "@/components/BaseMewListItem.vue";
 import { watch } from "vue";
-import { useToasts } from "@/stores/toasts";
 import BaseButtonBack from "@/components/BaseButtonBack.vue";
 import BaseListSkeleton from "@/components/BaseListSkeleton.vue";
 import BaseMewListItemSkeleton from "@/components/BaseMewListItemSkeleton.vue";
@@ -70,7 +69,6 @@ import BaseInfiniteScroll from "@/components/BaseInfiniteScroll.vue";
 const route = useRoute();
 const client = (inject("client") as ComputedRef<AppAgentClient>).value;
 const queryClient = useQueryClient();
-const { showError } = useToasts();
 
 const pageLimit = 10;
 
@@ -107,7 +105,7 @@ const { data, error, fetchNextPage, hasNextPage, isInitialLoading, refetch } =
     refetchInterval: 1000 * 60 * 2, // 2 minutes
     refetchOnMount: true,
   });
-watch(error, showError);
+watch(error, console.error);
 
 const fetchNextPageInfiniteScroll = async (
   done: (hasMore?: boolean) => void