diff --git a/src/common/utils/validator.ts b/src/common/utils/validator.ts
index 2468c4084e..e9058140c0 100644
--- a/src/common/utils/validator.ts
+++ b/src/common/utils/validator.ts
@@ -53,3 +53,16 @@ export const isValidPaymentPointer = (paymentPointer: string): boolean =>
   paymentPointer.startsWith('$')
 
 export const hasUpperCase = (str: string) => str.toLowerCase() !== str
+
+type NoticeNode = {
+  __typename?: string
+  id?: string
+}
+
+export const shouldRenderNode = (
+  node: NoticeNode,
+  renderableTypes: Set<string>
+): node is NoticeNode & { id: string } =>
+  node.__typename !== undefined &&
+  renderableTypes.has(node.__typename) &&
+  Boolean(node.id)
diff --git a/src/views/Follow/Feed/RecommendCircleActivity/gql.ts b/src/views/Follow/Feed/RecommendCircleActivity/gql.ts
deleted file mode 100644
index 286706c159..0000000000
--- a/src/views/Follow/Feed/RecommendCircleActivity/gql.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import gql from 'graphql-tag'
-
-import FollowingRecommendCircle from '../FollowingRecommendCircle'
-
-export const fragments = gql`
-  fragment RecommendCircleActivity on CircleRecommendationActivity {
-    recommendCircles: nodes {
-      ...FollowingFeedRecommendCirclePublic
-      ...FollowingFeedRecommendCirclePrivate
-    }
-  }
-  ${FollowingRecommendCircle.fragments.circle.public}
-  ${FollowingRecommendCircle.fragments.circle.private}
-`
diff --git a/src/views/Follow/Feed/RecommendCircleActivity/index.tsx b/src/views/Follow/Feed/RecommendCircleActivity/index.tsx
deleted file mode 100644
index 434cf59712..0000000000
--- a/src/views/Follow/Feed/RecommendCircleActivity/index.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { analytics } from '~/common/utils'
-import { Slides } from '~/components'
-import { RecommendCircleActivityFragment } from '~/gql/graphql'
-
-import FollowingRecommendCircle from '../FollowingRecommendCircle'
-import FollowingRecommendHead from '../FollowingRecommendHead'
-import { fragments } from './gql'
-import styles from './styles.module.css'
-
-interface Props {
-  circles: RecommendCircleActivityFragment['recommendCircles'] | null
-  location: number
-}
-
-const RecommendCircleActivity = ({ circles, location }: Props) => {
-  if (!circles || circles.length <= 0) {
-    return null
-  }
-
-  return (
-    <section className={styles.container}>
-      <Slides header={<FollowingRecommendHead type="circle" />}>
-        {circles.map((circle, index) => (
-          <Slides.Item
-            size="md"
-            key={index}
-            onClick={() => {
-              analytics.trackEvent('click_feed', {
-                type: 'following',
-                contentType: 'CircleRecommendationActivity',
-                location: `${location}.${index}`,
-                id: circle.id,
-              })
-            }}
-          >
-            <section className={styles.item}>
-              <FollowingRecommendCircle circle={circle} />
-            </section>
-          </Slides.Item>
-        ))}
-      </Slides>
-    </section>
-  )
-}
-
-RecommendCircleActivity.fragments = fragments
-
-export default RecommendCircleActivity
diff --git a/src/views/Follow/Feed/RecommendCircleActivity/styles.module.css b/src/views/Follow/Feed/RecommendCircleActivity/styles.module.css
deleted file mode 100644
index a0e4d16bbe..0000000000
--- a/src/views/Follow/Feed/RecommendCircleActivity/styles.module.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.container {
-  padding-bottom: var(--sp8);
-}
-
-.item {
-  @mixin border-grey;
-
-  border-radius: var(--sp8);
-}
diff --git a/src/views/Follow/Feed/gql.ts b/src/views/Follow/Feed/gql.ts
index 20226260f8..83b04ed971 100644
--- a/src/views/Follow/Feed/gql.ts
+++ b/src/views/Follow/Feed/gql.ts
@@ -1,7 +1,6 @@
 import gql from 'graphql-tag'
 
 import RecommendArticleActivity from './RecommendArticleActivity'
-import RecommendCircleActivity from './RecommendCircleActivity'
 import RecommendUserActivity from './RecommendUserActivity'
 import UserAddArticleTagActivity from './UserAddArticleTagActivity'
 import UserBroadcastCircleActivity from './UserBroadcastCircleActivity'
@@ -38,9 +37,6 @@ export const FOLLOWING_FEED = gql`
               ... on ArticleRecommendationActivity {
                 ...RecommendArticleActivity
               }
-              ... on CircleRecommendationActivity {
-                ...RecommendCircleActivity
-              }
               ... on UserRecommendationActivity {
                 ...RecommendUserActivity
               }
@@ -55,6 +51,5 @@ export const FOLLOWING_FEED = gql`
   ${UserCreateCircleActivity.fragments}
   ${UserPublishArticleActivity.fragments}
   ${RecommendArticleActivity.fragments}
-  ${RecommendCircleActivity.fragments}
   ${RecommendUserActivity.fragments}
 `
diff --git a/src/views/Follow/Feed/index.tsx b/src/views/Follow/Feed/index.tsx
index ae7ca870d0..2fba11885c 100644
--- a/src/views/Follow/Feed/index.tsx
+++ b/src/views/Follow/Feed/index.tsx
@@ -4,7 +4,7 @@ import _flatten from 'lodash/flatten'
 import _get from 'lodash/get'
 import { useIntl } from 'react-intl'
 
-import { analytics, mergeConnections } from '~/common/utils'
+import { analytics, mergeConnections, shouldRenderNode } from '~/common/utils'
 import {
   EmptyWarning,
   Head,
@@ -18,13 +18,21 @@ import { FollowingFeedQuery } from '~/gql/graphql'
 
 import { FOLLOWING_FEED } from './gql'
 import RecommendArticleActivity from './RecommendArticleActivity'
-import RecommendCircleActivity from './RecommendCircleActivity'
 import RecommendUserActivity from './RecommendUserActivity'
 import UserAddArticleTagActivity from './UserAddArticleTagActivity'
 import UserBroadcastCircleActivity from './UserBroadcastCircleActivity'
 import UserCreateCircleActivity from './UserCreateCircleActivity'
 import UserPublishArticleActivity from './UserPublishArticleActivity'
 
+const renderableTypes = new Set([
+  'UserPublishArticleActivity',
+  'UserBroadcastCircleActivity',
+  'UserCreateCircleActivity',
+  'UserAddArticleTagActivity',
+  'ArticleRecommendationActivity',
+  'UserRecommendationActivity',
+])
+
 const FollowingFeed = () => {
   const intl = useIntl()
   const { data, loading, error, fetchMore } =
@@ -92,38 +100,34 @@ const FollowingFeed = () => {
         eof
       >
         <List>
-          {edges.map(({ node }, i) => (
-            <List.Item key={`${node.__typename}:${i}`}>
-              {node.__typename === 'UserPublishArticleActivity' && (
-                <UserPublishArticleActivity location={i} {...node} />
-              )}
-              {node.__typename === 'UserBroadcastCircleActivity' && (
-                <UserBroadcastCircleActivity {...node} />
-              )}
-              {node.__typename === 'UserCreateCircleActivity' && (
-                <UserCreateCircleActivity location={i} {...node} />
-              )}
-              {node.__typename === 'UserAddArticleTagActivity' && (
-                <UserAddArticleTagActivity location={i} {...node} />
-              )}
-              {node.__typename === 'ArticleRecommendationActivity' && (
-                <RecommendArticleActivity
-                  location={i}
-                  articles={node.recommendArticles}
-                  source={node.source}
-                />
-              )}
-              {node.__typename === 'CircleRecommendationActivity' && (
-                <RecommendCircleActivity
-                  location={i}
-                  circles={node.recommendCircles}
-                />
-              )}
-              {node.__typename === 'UserRecommendationActivity' && (
-                <RecommendUserActivity users={node.recommendUsers} />
-              )}
-            </List.Item>
-          ))}
+          {edges.map(({ node }, i) => {
+            return shouldRenderNode(node, renderableTypes) ? (
+              <List.Item key={`${node.__typename}:${i}`}>
+                {node.__typename === 'UserPublishArticleActivity' && (
+                  <UserPublishArticleActivity location={i} {...node} />
+                )}
+                {node.__typename === 'UserBroadcastCircleActivity' && (
+                  <UserBroadcastCircleActivity {...node} />
+                )}
+                {node.__typename === 'UserCreateCircleActivity' && (
+                  <UserCreateCircleActivity location={i} {...node} />
+                )}
+                {node.__typename === 'UserAddArticleTagActivity' && (
+                  <UserAddArticleTagActivity location={i} {...node} />
+                )}
+                {node.__typename === 'ArticleRecommendationActivity' && (
+                  <RecommendArticleActivity
+                    location={i}
+                    articles={node.recommendArticles}
+                    source={node.source}
+                  />
+                )}
+                {node.__typename === 'UserRecommendationActivity' && (
+                  <RecommendUserActivity users={node.recommendUsers} />
+                )}
+              </List.Item>
+            ) : null
+          })}
         </List>
       </InfiniteScroll>
     </>
diff --git a/src/views/Me/Notifications/index.tsx b/src/views/Me/Notifications/index.tsx
index 7a82f5a387..f9fd3af9c4 100644
--- a/src/views/Me/Notifications/index.tsx
+++ b/src/views/Me/Notifications/index.tsx
@@ -3,7 +3,7 @@ import gql from 'graphql-tag'
 import { useEffect } from 'react'
 import { FormattedMessage, useIntl } from 'react-intl'
 
-import { mergeConnections } from '~/common/utils'
+import { mergeConnections, shouldRenderNode } from '~/common/utils'
 import {
   EmptyNotice,
   Head,
@@ -22,30 +22,16 @@ import {
   MeNotificationsQuery,
 } from '~/gql/graphql'
 
-type NoticeNode = {
-  __typename?: string
-  id?: string
-}
-
-function isSpecificNoticeType(
-  node: NoticeNode
-): node is NoticeNode & { id: string } {
-  const validTypes = new Set([
-    'ArticleArticleNotice',
-    'CircleNotice',
-    'ArticleNotice',
-    'CommentCommentNotice',
-    'CommentNotice',
-    'OfficialAnnouncementNotice',
-    'TransactionNotice',
-    'UserNotice',
-  ])
-  return (
-    node.__typename !== undefined &&
-    validTypes.has(node.__typename) &&
-    Boolean(node.id)
-  )
-}
+const renderableTypes = new Set([
+  'ArticleArticleNotice',
+  'CircleNotice',
+  'ArticleNotice',
+  'CommentCommentNotice',
+  'CommentNotice',
+  'OfficialAnnouncementNotice',
+  'TransactionNotice',
+  'UserNotice',
+])
 
 const ME_NOTIFICATIONS = gql`
   query MeNotifications($after: String) {
@@ -120,7 +106,7 @@ const BaseNotifications = () => {
       <List spacing={['xloose', 0]}>
         {edges.map(
           ({ node }) =>
-            isSpecificNoticeType(node) && (
+            shouldRenderNode(node, renderableTypes) && (
               <List.Item key={node.id}>
                 <Notice notice={node} />
               </List.Item>