new graphql query for tag by new

spknetwork · Jul 12, 2023 · c6003e0 · c6003e0
1 parent 1ad8ee2
commit c6003e0
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 22 deletions.
diff --git a/src/renderer/components/hooks/Feeds.ts b/src/renderer/components/hooks/Feeds.ts
@@ -253,6 +253,48 @@ const TRENDING_COMMUNITY_FEED = gql`
   }
 `
 
+const LATEST_TAG_FEED = gql`
+  query LatestCommunityFeed($id: String) {
+    feed: socialFeed(feedOptions: { byTag: { _eq: $id } }) {
+      items {
+        body
+        created_at
+        parent_author
+        parent_permlink
+        permlink
+        title
+        updated_at
+        ... on HivePost {
+          parent_author
+          parent_permlink
+          author {
+            username
+          }
+          json_metadata {
+            raw
+          }
+          stats {
+            num_comments
+            num_votes
+            total_hive_reward
+          }
+          app_metadata
+          spkvideo
+          refs
+          post_type
+          permlink
+          title
+          tags
+          updated_at
+          body
+          community
+          created_at
+        }
+      }
+    }
+  }
+`
+
 function transformGraphqlToNormal(data) {
   let blob = []
   for (let video of data) {
@@ -309,6 +351,8 @@ export function useGraphqlFeed(props: any) {
     query = TRENDING_COMMUNITY_FEED
   } else if (props.type === 'author-feed') {
     query = LATEST_FEED_AUTHOR
+  } else if (props.type === 'tag-new') {
+    query = LATEST_TAG_FEED
   } else {
     query = LATEST_FEED
   }
@@ -354,3 +398,15 @@ export function useTrendingCommunityFeed(parent_permlink) {
     return transformGraphqlToNormal(videos)
   }, [videos])
 }
+
+export function useNewTagFeed(parent_permlink) {
+  const { data, loading, error } = useQuery(LATEST_TAG_FEED, {
+    client: IndexerClient,
+    variables: { id: parent_permlink },
+  })
+  const videos = data?.latestFeed?.items || []
+
+  return useMemo(() => {
+    return transformGraphqlToNormal(videos)
+  }, [videos])
+}
diff --git a/src/renderer/views/TagView.tsx b/src/renderer/views/TagView.tsx
@@ -1,29 +1,20 @@
 import { GridFeedView } from './GridFeedView'
 import React, { useEffect, useMemo, useState } from 'react'
 import RefLink from '../../main/RefLink'
-import { useLatestCommunityFeed } from '../components/hooks/Feeds'
+import { useNewTagFeed } from '../components/hooks/Feeds'
 import { useParams } from 'react-router-dom'
 
 export function TagView(props: any) {
   //   let { reflink } = useParams<any>()
   const reflink = useMemo(() => {
     return RefLink.parse(props.match.params.reflink)
   }, [props.match])
-  const newVideos = useLatestCommunityFeed(reflink.root)
+  const newVideos = useNewTagFeed(reflink.root)
 
-  useEffect(() => {
-    console.log('newVideos')
-    console.log(newVideos)
-  }, [newVideos])
   return (
     <>
       {newVideos !== null ? (
-        <GridFeedView
-          key="community-new"
-          tag={reflink.root}
-          type={`community-new`}
-          data={newVideos}
-        />
+        <GridFeedView key="tag-new" type={`tag-new`} tag={reflink.root} data={newVideos} />
       ) : null}
     </>
   )

diff --git a/src/renderer/views/WatchView/WatchViewContent.tsx b/src/renderer/views/WatchView/WatchViewContent.tsx
@@ -1,13 +1,13 @@
-import React from 'react';
-import { Container, Col, Row } from 'react-bootstrap';
+import React from 'react'
+import { Container, Col, Row } from 'react-bootstrap'
 import { FollowWidget } from '../../components/widgets/FollowWidget'
 import { FaDownload } from 'react-icons/fa'
 import { CollapsibleText } from '../../components/CollapsibleText'
 import ReactMarkdown from 'react-markdown'
 import { BsInfoSquare } from 'react-icons/bs'
 import { CommentSection } from '../../components/video/CommentSection'
 import { VideoTeaser } from '../../components/video/VideoTeaser'
-import { Player } from '../../components/video/Player';
+import { Player } from '../../components/video/Player'
 import { LoopCircleLoading } from 'react-loadingg'
 import DateTime from 'date-and-time'
 import DOMPurify from 'dompurify'
@@ -34,7 +34,7 @@ export const WatchViewContent = (props: any) => {
     loadingMessage,
     reflink,
     Finder,
-  } = props;
+  } = props
 
   return (
     <div>
@@ -127,9 +127,9 @@ export const WatchViewContent = (props: any) => {
               <div className="single-video-info-content box mb-3">
                 <h6>About :</h6>
                 <CollapsibleText>
-                  <ReactMarkdown
-                    skipHtml={false}
-                  >{DOMPurify.sanitize(videoInfo.description)}</ReactMarkdown>
+                  <ReactMarkdown skipHtml={false}>
+                    {DOMPurify.sanitize(videoInfo.description)}
+                  </ReactMarkdown>
                   <hr />
                   <Container style={{ marginBottom: '10px', textAlign: 'center' }}>
                     <a
@@ -150,7 +150,7 @@ export const WatchViewContent = (props: any) => {
                       for (const tag of videoInfo.tags) {
                         out.push(
                           <span style={{ paddingLeft: '3px' }} key={tag}>
-                            <a>{tag}</a>
+                            <a href={`#/tag/hive:${tag}`}>{tag}</a>
                           </span>,
                         )
                       }
@@ -191,5 +191,5 @@ export const WatchViewContent = (props: any) => {
         </div>
       )}
     </div>
-  );
-};
+  )
+}