[#3680] control center reorganize routing for catalog (#3691)

* catalog route wip * catalog page fix * remove comment
airyhq · Sep 7, 2022 · cecf840 · cecf840
1 parent e4767aa
commit cecf840
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 85 deletions.
diff --git a/frontend/control-center/src/App.tsx b/frontend/control-center/src/App.tsx
@@ -8,7 +8,6 @@ import {Navigate, Route, Routes} from 'react-router-dom';
 import {INBOX_ROUTE, CATALOG_ROUTE, CONNECTORS_ROUTE, ROOT_ROUTE, STATUS_ROUTE, WEBHOOKS_ROUTE} from './routes/routes';
 import FacebookConnect from './pages/Connectors/Providers/Facebook/Messenger/FacebookConnect';
 import ChatPluginConnect from './pages/Connectors/Providers/Airy/ChatPlugin/ChatPluginConnect';
-import ConnectedChannelsList from './pages/Connectors/ConnectedChannelsList';
 import TwilioSmsConnect from './pages/Connectors/Providers/Twilio/SMS/TwilioSmsConnect';
 import TwilioWhatsappConnect from './pages/Connectors/Providers/Twilio/WhatsApp/TwilioWhatsappConnect';
 import GoogleConnect from './pages/Connectors/Providers/Google/GoogleConnect';
@@ -55,14 +54,6 @@ const App = (props: ConnectedProps<typeof connector>) => {
           </Route>
 
           <Route path={`${CATALOG_ROUTE}/*`} element={<CatalogOutlet />}>
-            <Route path={`facebook/:channelId`} element={<FacebookConnect />} />
-            <Route path={`chatplugin/:channelId`} element={<ChatPluginConnect />} />
-            <Route path={`connected/:source`} element={<ConnectedChannelsList />} />
-            <Route path={`twilio.sms/:channelId`} element={<TwilioSmsConnect />} />
-            <Route path={`twilio.whatsapp/:channelId`} element={<TwilioWhatsappConnect />} />
-            <Route path={`google/:channelId`} element={<GoogleConnect />} />
-            <Route path={`instagram/:channelId`} element={<InstagramConnect />} />
-
             <Route path={`:componentName`} element={<CatalogProductPage />} />
             <Route index element={<Catalog />} />
           </Route>

diff --git a/frontend/control-center/src/pages/Catalog/CatalogCard/index.tsx b/frontend/control-center/src/pages/Catalog/CatalogCard/index.tsx
@@ -72,7 +72,7 @@ const CatalogCard = (props: CatalogCardProps) => {
     const isClickOnCard = componentCard?.current.contains(e.target);
 
     if (!isClickOnInstallButton && isClickOnCard) {
-      navigate(getCatalogProductRouteForComponent(componentInfo.displayName), {state: {componentInfo}});
+      navigate(getCatalogProductRouteForComponent(componentInfo.source), {state: {componentInfo}});
     }
   };
 

diff --git a/frontend/control-center/src/routes/routes.ts b/frontend/control-center/src/routes/routes.ts
@@ -3,23 +3,6 @@ export const ROOT_ROUTE = '/';
 export const CONNECTORS_ROUTE = '/connectors';
 
 export const CATALOG_ROUTE = '/catalog';
-export const CATALOG_FACEBOOK_ROUTE = '/catalog/facebook';
-export const CATALOG_CHAT_PLUGIN_ROUTE = '/catalog/chatplugin';
-export const CATALOG_TWILIO_SMS_ROUTE = '/catalog/twilio.sms';
-export const CATALOG_TWILIO_WHATSAPP_ROUTE = '/catalog/twilio.whatsapp';
-export const CATALOG_WHATSAPP_BUSINESS_CLOUD_ROUTE = '/catalog/whatsapp-cloud';
-export const CATALOG_GOOGLE_ROUTE = '/catalog/google';
-export const CATALOG_INSTAGRAM_ROUTE = '/catalog/instagram';
-export const CATALOG_DIALOGFLOW_ROUTE = '/catalog/dialogflow';
-export const CATALOG_ZENDESK_ROUTE = '/catalog/zendesk';
-export const CATALOG_SALESFORCE_ROUTE = '/catalog/salesforce';
-export const CATALOG_CONGNIFY_ROUTE = '/catalog/congnify';
-export const CATALOG_AMELIA_ROUTE = '/catalog/amelia';
-export const CATALOG_FRONTEND_INBOX_ROUTE = '/catalog/frontend-inbox';
-export const CATALOG_RASA_ROUTE = '/catalog/rasa';
-export const CATALOG_WEBHOOKS_ROUTE = '/catalog/webhooks';
-export const CATALOG_MOBILE_ROUTE = '/catalog/mobile';
-export const CATALOG_VIBER_ROUTE = '/catalog/viber';
 
 export const INBOX_ROUTE = '/inbox';
 

diff --git a/frontend/control-center/src/services/getRouteForCard.ts b/frontend/control-center/src/services/getRouteForCard.ts
@@ -1,24 +1,4 @@
-import {
-  CONNECTORS_ROUTE,
-  CATALOG_FACEBOOK_ROUTE,
-  CATALOG_CHAT_PLUGIN_ROUTE,
-  CATALOG_TWILIO_SMS_ROUTE,
-  CATALOG_TWILIO_WHATSAPP_ROUTE,
-  CATALOG_WHATSAPP_BUSINESS_CLOUD_ROUTE,
-  CATALOG_GOOGLE_ROUTE,
-  CATALOG_INSTAGRAM_ROUTE,
-  CATALOG_DIALOGFLOW_ROUTE,
-  CATALOG_ZENDESK_ROUTE,
-  CATALOG_SALESFORCE_ROUTE,
-  CATALOG_CONGNIFY_ROUTE,
-  CATALOG_AMELIA_ROUTE,
-  CATALOG_FRONTEND_INBOX_ROUTE,
-  CATALOG_RASA_ROUTE,
-  CATALOG_WEBHOOKS_ROUTE,
-  CATALOG_MOBILE_ROUTE,
-  CATALOG_VIBER_ROUTE,
-  WEBHOOKS_ROUTE,
-} from '../routes/routes';
+import {CONNECTORS_ROUTE, CATALOG_ROUTE, WEBHOOKS_ROUTE} from '../routes/routes';
 import {Source} from 'model';
 
 export const getConnectedRouteForComponent = (source: Source, isChannel: string) => {
@@ -33,41 +13,6 @@ export const getNewChannelRouteForComponent = (source: Source) => {
   return source === Source.webhooks ? WEBHOOKS_ROUTE : `${CONNECTORS_ROUTE}/${source}/new`;
 };
 
-export const getCatalogProductRouteForComponent = (displayName: string) => {
-  switch (displayName) {
-    case 'Airy Chat Plugin':
-      return CATALOG_CHAT_PLUGIN_ROUTE;
-    case 'Facebook Messenger':
-      return CATALOG_FACEBOOK_ROUTE;
-    case 'Twilio SMS':
-      return CATALOG_TWILIO_SMS_ROUTE;
-    case 'Twilio WhatsApp':
-      return CATALOG_TWILIO_WHATSAPP_ROUTE;
-    case 'WhatsApp Business Cloud':
-      return CATALOG_WHATSAPP_BUSINESS_CLOUD_ROUTE;
-    case 'Google Business Messages':
-      return CATALOG_GOOGLE_ROUTE;
-    case 'Instagram':
-      return CATALOG_INSTAGRAM_ROUTE;
-    case 'Dialogflow':
-      return CATALOG_DIALOGFLOW_ROUTE;
-    case 'Salesforce':
-      return CATALOG_SALESFORCE_ROUTE;
-    case 'Zendesk':
-      return CATALOG_ZENDESK_ROUTE;
-    case 'Congnigy':
-      return CATALOG_CONGNIFY_ROUTE;
-    case 'Amelia':
-      return CATALOG_AMELIA_ROUTE;
-    case 'Inbox':
-      return CATALOG_FRONTEND_INBOX_ROUTE;
-    case 'Rasa':
-      return CATALOG_RASA_ROUTE;
-    case 'Mobile':
-      return CATALOG_MOBILE_ROUTE;
-    case 'Webhooks':
-      return CATALOG_WEBHOOKS_ROUTE;
-    case 'Viber':
-      return CATALOG_VIBER_ROUTE;
-  }
+export const getCatalogProductRouteForComponent = (source: Source) => {
+  return `${CATALOG_ROUTE}/${source}`;
 };