From 1dcf0753ea874ba985bf2c41279b13fa2f8e9729 Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Mon, 22 Nov 2021 17:40:46 +0700
Subject: [PATCH] updating related on tags changed

---
 src/pages/node/[id].tsx                     |  2 +-
 src/utils/hooks/data/useGetNodeRelated.ts   |  7 +++++--
 src/utils/providers/NodeRelatedProvider.tsx | 17 +++++++++++++----
 3 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/pages/node/[id].tsx b/src/pages/node/[id].tsx
index 4b2d197a..6d4067b5 100644
--- a/src/pages/node/[id].tsx
+++ b/src/pages/node/[id].tsx
@@ -41,7 +41,7 @@ const NodePage: FC<Props> = ({
 
   return (
     <NodeContextProvider node={node} isLoading={isLoading}>
-      <NodeRelatedProvider id={parseInt(id, 10)}>
+      <NodeRelatedProvider id={parseInt(id, 10)} tags={node.tags}>
         <CommentContextProvider
           comments={comments}
           count={commentsCount}
diff --git a/src/utils/hooks/data/useGetNodeRelated.ts b/src/utils/hooks/data/useGetNodeRelated.ts
index 5c0a5645..c1e8d86f 100644
--- a/src/utils/hooks/data/useGetNodeRelated.ts
+++ b/src/utils/hooks/data/useGetNodeRelated.ts
@@ -4,12 +4,15 @@ import { AxiosResponse } from 'axios';
 import { ApiGetNodeRelatedResult } from '~/redux/node/types';
 import { API } from '~/constants/api';
 import { api } from '~/utils/api';
+import { useCallback } from 'react';
 
 export const useGetNodeRelated = (id?: INode['id']) => {
-  const { data, isValidating: isLoading } = useSWR<AxiosResponse<ApiGetNodeRelatedResult>>(
+  const { data, isValidating: isLoading, mutate } = useSWR<AxiosResponse<ApiGetNodeRelatedResult>>(
     API.NODE.RELATED(id),
     api.get
   );
 
-  return { related: data?.data.related, isLoading };
+  const refresh = useCallback(() => mutate(data, true), [data, mutate]);
+
+  return { related: data?.data.related, isLoading, refresh };
 };
diff --git a/src/utils/providers/NodeRelatedProvider.tsx b/src/utils/providers/NodeRelatedProvider.tsx
index b2e55a56..5211b2a1 100644
--- a/src/utils/providers/NodeRelatedProvider.tsx
+++ b/src/utils/providers/NodeRelatedProvider.tsx
@@ -1,11 +1,12 @@
-import React, { FC } from 'react';
-import { INode } from '~/redux/types';
+import React, { FC, useEffect } from 'react';
+import { INode, ITag } from '~/redux/types';
 import { NodeRelatedContextProvider } from '~/utils/context/NodeRelatedContextProvider';
 import { INodeRelated } from '~/redux/node/types';
 import { useGetNodeRelated } from '~/utils/hooks/data/useGetNodeRelated';
 
 interface NodeRelatedProviderProps {
   id: INode['id'];
+  tags?: ITag[];
 }
 
 const defaultValue: INodeRelated = {
@@ -13,8 +14,16 @@ const defaultValue: INodeRelated = {
   similar: [],
 };
 
-const NodeRelatedProvider: FC<NodeRelatedProviderProps> = ({ id, children }) => {
-  const { related, isLoading } = useGetNodeRelated(id);
+const NodeRelatedProvider: FC<NodeRelatedProviderProps> = ({ id, children, tags }) => {
+  const { related, isLoading, refresh } = useGetNodeRelated(id);
+
+  useEffect(
+    () => {
+      refresh();
+    },
+    // eslint-disable-next-line
+    [tags]
+  );
 
   return (
     <NodeRelatedContextProvider related={related || defaultValue} isLoading={isLoading}>