From 1ad66fccd0fafe4c256444be02560d4006d7cf8b Mon Sep 17 00:00:00 2001
From: infinite-persistence <inf.persistence@gmail.com>
Date: Mon, 25 Apr 2022 13:44:22 +0800
Subject: [PATCH] Category: Hide "Repost" from ContentType filter, except for
 WildWest

## Ticket
1368
> can we remove the repost filter option on categories outside of wildwest/following?

## Approach
Using `context` to:
- reduce the amount of files that need to change.
- avoid prop-drilling.
- allow the ability to dynamically define the Filter's allowed values in a contained manner.

Clients that don't need customization simply does not need to wrap their component with the context.

The context only contains Content Type for now, but can include anything that future clients need to dynamically adjust.
---
 .flowconfig                              |  1 +
 ui/component/claimListHeader/view.jsx    |  4 +-
 ui/contexts/claimSearchFilterContext.jsx |  9 +++
 ui/page/discover/view.jsx                | 73 +++++++++++++-----------
 4 files changed, 54 insertions(+), 33 deletions(-)
 create mode 100644 ui/contexts/claimSearchFilterContext.jsx

diff --git a/.flowconfig b/.flowconfig
index b6992488b..246a00038 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -16,6 +16,7 @@
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe
 suppress_comment=\\(.\\|\n\\)*\\$FlowIssue
 module.name_mapper='^constants\(.*\)$' -> '<PROJECT_ROOT>/ui/constants\1'
+module.name_mapper='^contexts\(.*\)$' -> '<PROJECT_ROOT>/ui/contexts\1'
 module.name_mapper='^util\(.*\)$' -> '<PROJECT_ROOT>/ui/util\1'
 module.name_mapper='^redux\(.*\)$' -> '<PROJECT_ROOT>/ui/redux\1'
 module.name_mapper='^types\(.*\)$' -> '<PROJECT_ROOT>/ui/types\1'
diff --git a/ui/component/claimListHeader/view.jsx b/ui/component/claimListHeader/view.jsx
index 978423210..b6ba05bb3 100644
--- a/ui/component/claimListHeader/view.jsx
+++ b/ui/component/claimListHeader/view.jsx
@@ -11,6 +11,7 @@ import { FormField } from 'component/common/form';
 import Button from 'component/button';
 import { toCapitalCase } from 'util/string';
 import SEARCHABLE_LANGUAGES from 'constants/searchable_languages';
+import { ClaimSearchFilterContext } from 'contexts/claimSearchFilterContext';
 
 type Props = {
   defaultTags: string,
@@ -62,6 +63,7 @@ function ClaimListHeader(props: Props) {
     languageSetting,
     scrollAnchor,
   } = props;
+  const filterCtx = React.useContext(ClaimSearchFilterContext);
   const { action, push, location } = useHistory();
   const { search } = location;
   const [expanded, setExpanded] = usePersistedState(`expanded-${location.pathname}`, false);
@@ -345,7 +347,7 @@ function ClaimListHeader(props: Props) {
                       })
                     }
                   >
-                    {CS.CONTENT_TYPES.map((type) => {
+                    {filterCtx.contentTypes.map((type) => {
                       if (type !== CS.CLAIM_CHANNEL || (type === CS.CLAIM_CHANNEL && !channelIdsParam)) {
                         return (
                           <option key={type} value={type}>
diff --git a/ui/contexts/claimSearchFilterContext.jsx b/ui/contexts/claimSearchFilterContext.jsx
new file mode 100644
index 000000000..3bad16d4e
--- /dev/null
+++ b/ui/contexts/claimSearchFilterContext.jsx
@@ -0,0 +1,9 @@
+import React from 'react';
+import * as CS from 'constants/claim_search';
+
+export const ClaimSearchFilterContext = React.createContext({
+  contentTypes: CS.CONTENT_TYPES,
+  // --Future expansion:
+  // durationTypes: CS.DURATION_TYPES,
+  // ...
+});
diff --git a/ui/page/discover/view.jsx b/ui/page/discover/view.jsx
index 8b33a418c..6de39d804 100644
--- a/ui/page/discover/view.jsx
+++ b/ui/page/discover/view.jsx
@@ -8,6 +8,7 @@ import * as CS from 'constants/claim_search';
 import Page from 'component/page';
 import ClaimListDiscover from 'component/claimListDiscover';
 import Button from 'component/button';
+import { ClaimSearchFilterContext } from 'contexts/claimSearchFilterContext';
 import useHover from 'effects/use-hover';
 import { useIsMobile } from 'effects/use-screensize';
 import analytics from 'analytics';
@@ -19,6 +20,8 @@ import I18nMessage from 'component/i18nMessage';
 import moment from 'moment';
 import LivestreamSection from './livestreamSection';
 
+const CATEGORY_CONTENT_TYPES_FILTER = CS.CONTENT_TYPES.filter((x) => x !== CS.CLAIM_REPOST);
+
 type Props = {
   dynamicRouteProps: RowDataItem,
   location: { search: string },
@@ -77,6 +80,10 @@ function DiscoverPage(props: Props) {
   }
 
   const includeLivestreams = !tagsQuery;
+  const filters = { contentTypes: isCategory && !isWildWest ? CATEGORY_CONTENT_TYPES_FILTER : CS.CONTENT_TYPES };
+
+  // **************************************************************************
+  // **************************************************************************
 
   function getMeta() {
     if (!dynamicRouteProps) {
@@ -191,38 +198,40 @@ function DiscoverPage(props: Props) {
       fullWidthPage={tileLayout}
       className={classnames('main__discover', { 'hide-ribbon': hideRepostRibbon })}
     >
-      <ClaimListDiscover
-        pins={getPins(dynamicRouteProps)}
-        hideFilters={isWildWest ? true : undefined}
-        header={repostedUri ? <span /> : undefined}
-        subSection={getSubSection()}
-        tileLayout={repostedUri ? false : tileLayout}
-        defaultOrderBy={isWildWest || tags ? CS.ORDER_BY_TRENDING : undefined}
-        claimType={claimType ? [claimType] : undefined}
-        headerLabel={headerLabel}
-        tags={tags}
-        hiddenNsfwMessage={<HiddenNsfw type="page" />}
-        repostedClaimId={repostedClaim ? repostedClaim.claim_id : null}
-        injectedItem={!isWildWest && { node: <Ads small type="video" tileLayout={tileLayout} /> }}
-        // Assume wild west page if no dynamicRouteProps
-        // Not a very good solution, but just doing it for now
-        // until we are sure this page will stay around
-        // TODO: find a better way to determine discover / wild west vs other modes release times
-        // for now including && !tags so that
-        releaseTime={releaseTime || undefined}
-        feeAmount={isWildWest || tags ? CS.FEE_AMOUNT_ANY : undefined}
-        channelIds={channelIds}
-        excludedChannelIds={excludedChannelIds}
-        limitClaimsPerChannel={
-          SIMPLE_SITE
-            ? (dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.limitClaimsPerChannel) || 3
-            : 3
-        }
-        meta={getMeta()}
-        hasSource
-        forceShowReposts={dynamicRouteProps}
-        searchLanguages={dynamicRouteProps?.options?.searchLanguages}
-      />
+      <ClaimSearchFilterContext.Provider value={filters}>
+        <ClaimListDiscover
+          pins={getPins(dynamicRouteProps)}
+          hideFilters={isWildWest ? true : undefined}
+          header={repostedUri ? <span /> : undefined}
+          subSection={getSubSection()}
+          tileLayout={repostedUri ? false : tileLayout}
+          defaultOrderBy={isWildWest || tags ? CS.ORDER_BY_TRENDING : undefined}
+          claimType={claimType ? [claimType] : undefined}
+          headerLabel={headerLabel}
+          tags={tags}
+          hiddenNsfwMessage={<HiddenNsfw type="page" />}
+          repostedClaimId={repostedClaim ? repostedClaim.claim_id : null}
+          injectedItem={!isWildWest && { node: <Ads small type="video" tileLayout={tileLayout} /> }}
+          // Assume wild west page if no dynamicRouteProps
+          // Not a very good solution, but just doing it for now
+          // until we are sure this page will stay around
+          // TODO: find a better way to determine discover / wild west vs other modes release times
+          // for now including && !tags so that
+          releaseTime={releaseTime || undefined}
+          feeAmount={isWildWest || tags ? CS.FEE_AMOUNT_ANY : undefined}
+          channelIds={channelIds}
+          excludedChannelIds={excludedChannelIds}
+          limitClaimsPerChannel={
+            SIMPLE_SITE
+              ? (dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.limitClaimsPerChannel) || 3
+              : 3
+          }
+          meta={getMeta()}
+          hasSource
+          forceShowReposts={dynamicRouteProps}
+          searchLanguages={dynamicRouteProps?.options?.searchLanguages}
+        />
+      </ClaimSearchFilterContext.Provider>
     </Page>
   );
 }