Merge pull request #3264 from JoinColony/feat/16099237-streaming-payments-subpage

feat: add streaming payments subpage

Author: adam-strzelec

src/components/frame/Extensions/layouts/consts.ts

@@ -15,7 +15,7 @@ import {
   // SealCheck,
   // ChartPieSlice,
   // ListChecks,
-  // ChartLine,
+  ChartLine,
   // Intersect,
   // Briefcase,
   // BookOpenText,
@@ -37,6 +37,7 @@ import {
   COLONY_PERMISSIONS_ROUTE,
   // COLONY_REPUTATION_ROUTE,
   COLONY_TEAMS_ROUTE,
+  COLONY_STREAMING_PAYMENTS_ROUTE,
   // COLONY_VERIFIED_ROUTE,
 } from '~routes/routeConstants.ts';
 import { formatText } from '~utils/intl.ts';
@@ -112,12 +113,12 @@ export const financesMenu: NavigationSidebarLinksListProps['items'] = [
   //     text: 'Coming soon',
   //   },
   // },
-  // {
-  //   key: '5',
-  //   label: formatText({ id: 'navigation.finances.streamingPayments' }),
-  //   to: '/streaming-payments',
-  //   icon: ChartLine
-  // },
+  {
+    key: '5',
+    label: formatText({ id: 'navigation.finances.streamingPayments' }),
+    to: COLONY_STREAMING_PAYMENTS_ROUTE,
+    icon: ChartLine,
+  },
 ];
 
 // @todo: update routes when pages will be ready

src/components/frame/v5/pages/StreamingPaymentsPage/StreamingPaymentsPage.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+import { useSetPageHeadingTitle } from '~context/PageHeadingContext/PageHeadingContext.ts';
+import { formatText } from '~utils/intl.ts';
+
+const displayName = 'v5.pages.StreamingPaymentsPage';
+
+const StreamingPaymentsPage = () => {
+  useSetPageHeadingTitle(
+    formatText({ id: 'navigation.finances.streamingPayments' }),
+  );
+
+  return <div />;
+};
+
+StreamingPaymentsPage.displayName = displayName;
+
+export default StreamingPaymentsPage;

src/routes/Routes.tsx

@@ -24,6 +24,7 @@ import MembersPage, {
   ContributorsPage,
 } from '~frame/v5/pages/MembersPage/index.ts';
 import OnboardingPage from '~frame/v5/pages/OnboardingPage/index.ts';
+import StreamingPaymentsPage from '~frame/v5/pages/StreamingPaymentsPage/StreamingPaymentsPage.tsx';
 import TeamsPage from '~frame/v5/pages/TeamsPage/index.ts';
 import UserAdvancedPage from '~frame/v5/pages/UserAdvancedPage/index.ts';
 import UserCryptoToFiatPage from '~frame/v5/pages/UserCryptoToFiatPage/CryptoToFiatPage.tsx';
@@ -68,6 +69,7 @@ import {
   COLONY_MULTISIG_ROUTE,
   COLONY_AGREEMENTS_ROUTE,
   USER_CRYPTO_TO_FIAT_ROUTE,
+  COLONY_STREAMING_PAYMENTS_ROUTE,
   // ACTIONS_PAGE_ROUTE,
   // UNWRAP_TOKEN_ROUTE,
   // CLAIM_TOKEN_ROUTE,
@@ -141,6 +143,10 @@ const Routes = () => {
             <Route path={COLONY_VERIFIED_ROUTE} element={<VerifiedPage />} />
             <Route path={COLONY_BALANCES_ROUTE} element={<BalancePage />} />
             <Route path={COLONY_TEAMS_ROUTE} element={<TeamsPage />} />
+            <Route
+              path={COLONY_STREAMING_PAYMENTS_ROUTE}
+              element={<StreamingPaymentsPage />}
+            />
           </Route>
 
           <Route path={COLONY_REPUTATION_ROUTE} element={<ReputationPage />} />

src/routes/routeConstants.ts

@@ -22,6 +22,7 @@ export const COLONY_ADVANCED_ROUTE = `advanced`;
 export const COLONY_EXTENSION_DETAILS_ROUTE = `${COLONY_EXTENSIONS_ROUTE}/:extensionId`;
 export const COLONY_INCOMING_ROUTE = `incoming`;
 export const COLONY_BALANCES_ROUTE = `balances`;
+export const COLONY_STREAMING_PAYMENTS_ROUTE = `streaming-payments`;
 export const COLONY_MEMBERS_ROUTE = `members`;
 export const COLONY_MEMBERS_WITH_DOMAIN_ROUTE = `members/:domainId`;
 export const COLONY_CONTRIBUTORS_ROUTE = `members/contributors`;