added review changes

src/common/Common.types.ts

@@ -5,3 +5,5 @@ export type ModalResponse = {
 };
 
 export type UnlockProfileModalTypes = 'portal' | 'container';
+
+export type EnvType = 'prod' | 'dev' | 'staging';

src/common/Common.utils.tsx

@@ -1,6 +1,7 @@
 import { appConfig } from 'config';
 import { LOGO_ALIAS_CHAIN } from './Common.constants';
 import { networkName } from 'helpers/UtilityHelper';
+import { EnvType } from './Common.types';
 
 export const allowedNetworks = appConfig.allowedNetworks.filter(
   (chain: number) => chain != appConfig.coreContractChain
@@ -49,8 +50,6 @@ export const isValidURL = (str: string | undefined) => {
   return !!pattern.test(str);
 };
 
-export const envUtil = {
-  isProd: appConfig.appEnv === 'prod',
-  isDev: appConfig.appEnv === 'dev',
-  isStaging: appConfig.appEnv === 'staging',
+export const getCurrentEnv = (): EnvType => {
+  return appConfig.appEnv;
 };

src/modules/channels/Channels.tsx

@@ -1,16 +1,18 @@
 import { FC } from 'react';
 import { ChannelListOrderType, ChannelListSortType } from '@pushprotocol/restapi';
 
-import { Box, Search, Text } from 'blocks';
-import { appConfig } from 'config';
-import { getSelectChains } from 'common';
-import { useChannelSearch, useGetChannelslist } from 'queries';
 import { useChannelsFilters } from './hooks/useChannelsFilters';
+import { useChannelSearch, useGetChannelslist } from 'queries';
+
+import { Box, Search, Text } from 'blocks';
 import { ChannelSearchAndChainSelection } from './components/ChannelSearchAndChainSelection';
 import { ChannelCategories } from './components/ChannelCategories';
 import { AllChannelList } from './components/AllChannelsList';
+
+import { getSelectChains } from 'common';
 import { AllCategories, channelFilterList } from './Channels.constants';
-import { filterFrontendChannels } from './Channels.utils';
+import { getSuggestedChannels } from './Channels.utils';
+import { appConfig } from 'config';
 
 export type ChannelsProps = {};
 
@@ -58,7 +60,7 @@ const Channels: FC<ChannelsProps> = () => {
           .flatMap((page) => page.channels)
           .filter((channel) => !channelFilterList.includes(channel.channel)) || [];
 
-  const filteredFrontendChannels = filterFrontendChannels(channels, filters);
+  const suggestedChannels = getSuggestedChannels(channels, filters);
 
   const hasMoreData = filters.search
     ? !isSearchingNextPageForChannels && hasNextPageForSearch
@@ -97,7 +99,7 @@ const Channels: FC<ChannelsProps> = () => {
             setFilter={setFilter}
           />
         </Box>
-        {!channels.length && !filteredFrontendChannels.length && !isLoading ? (
+        {!channels.length && !suggestedChannels.length && !isLoading ? (
           <Box
             display="flex"
             gap="spacing-xs"
@@ -116,7 +118,7 @@ const Channels: FC<ChannelsProps> = () => {
           <AllChannelList
             channels={channels}
             hasMoreData={hasMoreData}
-            frontendChannels={filteredFrontendChannels}
+            suggestedChannels={suggestedChannels}
             isLoading={isLoading}
             isLoadingNextPage={isFetchingNextPageForChannels || isSearchingNextPageForChannels}
             loadMore={filters.search ? searchChannelsForNextPage : fetchChannelsForNextPage}

src/modules/channels/Channels.utils.ts

@@ -1,14 +1,16 @@
-import { channelCategoriesMap, envUtil } from 'common';
-import { ChannelDetails } from 'queries';
+import { channelCategoriesMap, getCurrentEnv } from 'common';
+
 import { Filters } from './hooks/useChannelsFilters';
+import { ChannelDetails } from 'queries';
+
 import { AllCategories, channelFilterList } from './Channels.constants';
 
-export const showFrontendChannels = (filters: Filters) => {
-  return envUtil.isProd && filters?.category && filters?.category != AllCategories;
+export const showSuggestedChannels = (filters: Filters) => {
+  return getCurrentEnv() === 'prod' && filters?.category && filters?.category != AllCategories;
 };
 
-export const filterFrontendChannels = (channels: ChannelDetails[], filter: Filters): Array<string> => {
-  if (showFrontendChannels(filter)) {
+export const getSuggestedChannels = (channels: ChannelDetails[], filter: Filters): Array<string> => {
+  if (showSuggestedChannels(filter)) {
     const channelIds = channels.map((channel) => channel.channel);
     return Object.keys(channelCategoriesMap).filter(
       (channel) =>

src/modules/channels/components/AllChannelsList.tsx

@@ -1,18 +1,21 @@
 import { FC } from 'react';
+
 import InfiniteScroll from 'react-infinite-scroller';
 import { css } from 'styled-components';
-import { Box, deviceMediaQ, Spinner } from 'blocks';
+
 import { ChannelDetails } from 'queries';
+
 import { AllChannelsListItem } from './AllChannelsListItem';
-import { FrontendChannelListItem } from './FrontendChannelListItem';
+import { SuggestedChannelListItem } from './SuggestedChannelListItem';
+import { Box, deviceMediaQ, Spinner } from 'blocks';
 
 export type AllChannelListProps = {
   channels: ChannelDetails[];
   hasMoreData: boolean;
   isLoading: boolean;
   isLoadingNextPage: boolean;
   loadMore: () => void;
-  frontendChannels: Array<string>;
+  suggestedChannels: Array<string>;
 };
 
 const AllChannelList: FC<AllChannelListProps> = ({
@@ -21,7 +24,7 @@ const AllChannelList: FC<AllChannelListProps> = ({
   isLoading,
   isLoadingNextPage,
   loadMore,
-  frontendChannels,
+  suggestedChannels,
 }) => {
   return (
     <Box
@@ -53,8 +56,8 @@ const AllChannelList: FC<AllChannelListProps> = ({
         threshold={150}
         className="channel-scroll"
       >
-        {frontendChannels.map((channel: string) => (
-          <FrontendChannelListItem
+        {suggestedChannels.map((channel: string) => (
+          <SuggestedChannelListItem
             channelAddress={channel}
             key={`${channel}`}
           />

src/modules/channels/components/FrontendChannelListItem.tsx → src/modules/channels/components/SuggestedChannelListItem.tsx

@@ -1,12 +1,14 @@
-import { useGetChannelDetails } from 'queries';
 import { FC } from 'react';
+
+import { useGetChannelDetails } from 'queries';
+
 import { AllChannelsListItem } from './AllChannelsListItem';
 
-export type FrontendChannelListItemProps = {
+export type SuggestedChannelListItemProps = {
   channelAddress: string;
 };
 
-const FrontendChannelListItem: FC<FrontendChannelListItemProps> = ({ channelAddress }) => {
+const SuggestedChannelListItem: FC<SuggestedChannelListItemProps> = ({ channelAddress }) => {
   const { data: channelDetails, isLoading } = useGetChannelDetails(channelAddress);
 
   return (
@@ -17,4 +19,4 @@ const FrontendChannelListItem: FC<FrontendChannelListItemProps> = ({ channelAddr
   );
 };
 
-export { FrontendChannelListItem };
+export { SuggestedChannelListItem };