feat(gene-next): routing - handle start and error in $routeChanged observable (#57)

Author: matzimowski

packages/gene-apollo/src/apollo/useApolloObservableQuery.ts

@@ -38,7 +38,7 @@ export function useApolloObservableQuery<TData, TVariables>(
     newObservable
   );
 
-  const isRouterEvent = response?.type === 'routeChanged';
+  const isRouterEvent = response?.type === 'routeChangeComplete';
   const isServerValueOrRouterEventOrObservableValueIsEmpty =
     isRouterEvent || isServer() || !response?.data;
 

packages/gene-next/src/routing/routers/next.ts

@@ -36,19 +36,46 @@ export function useTransformedNextRouter(): Router {
   const $routeChanged = React.useMemo(
     () =>
       new Observable<RouterEvent>((observer) => {
-        const handler = ([currentPathname]: [string]) => {
+        const handleStart = (path: string, options?: NavigateOptions) => {
           observer.next({
-            type: 'routeChanged',
+            type: 'routeChangeStart',
             payload: {
-              currentPathname,
+              path,
+              options
+            },
+          });
+        };
+
+        const handleComplete = (path: string, options?: NavigateOptions) => {
+          observer.next({
+            type: 'routeChangeComplete',
+            payload: {
+              path,
+              options
+            },
+          });
+        };
+
+        const handleError = (path: string, options?: NavigateOptions) => {
+          observer.next({
+            type: 'routeChangeError',
+            payload: {
+              path,
+              options
             },
           });
         };
 
         if (events) {
-          events.on('routeChangeComplete', handler);
+          events.on('routeChangeStart', handleStart);
+          events.on('routeChangeComplete', handleComplete);
+          events.on('routeChangeError', handleError);
 
-          return () => events.off('routeChangeComplete', handler);
+          return () => {
+            events.off('routeChangeStart', handleStart);
+            events.off('routeChangeComplete', handleComplete);
+            events.off('routeChangeError', handleError);
+          }
         }
         return () => null;
       }),

packages/gene/src/routing/types.ts

@@ -31,9 +31,10 @@ export interface UrlObject {
 }
 
 export interface RouterEvent {
-  type: 'routeChanged';
+  type: 'routeChangeStart' | 'routeChangeComplete' | 'routeChangeError';
   payload: {
-    currentPathname: string;
+    path: string;
+    options?: NavigateOptions;
   };
 }