feat: Add createRouteView & createRoutesView

Author: Kelin2025

src/create-route-view.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { combine } from 'effector';
+import { useStore } from 'effector-react';
+import { RouteInstance } from 'atomic-router';
+
+export const createRouteView = <Props,>(
+  route: RouteInstance<any> | RouteInstance<any>[],
+  View: React.FC<Props>
+) => {
+  const $isOpened = Array.isArray(route)
+    ? combine(combine(route.map((r) => r.$isOpened)), (isOpened) =>
+        isOpened.includes(true)
+      )
+    : route.$isOpened;
+
+  return (props: Props) => {
+    const isOpened = useStore($isOpened);
+
+    if (isOpened) {
+      return <View {...props} />;
+    }
+
+    return null;
+  };
+};

src/create-routes-view.tsx

@@ -0,0 +1,39 @@
+import { combine } from 'effector';
+import { useStore } from 'effector-react';
+import React, { FC } from 'react';
+import { RouteInstance } from 'atomic-router';
+import { createRouteView } from './create-route-view';
+
+export const createRoutesView = (config: {
+  routes: { route: RouteInstance<any> | RouteInstance<any>[]; view: FC<any> }[];
+  notFound?: FC<any>;
+}) => {
+  const views = config.routes.map(({ route, view }) =>
+    createRouteView(route, view)
+  );
+  const $isSomeOpened = combine(
+    ...config.routes
+      .map(({ route }) => route)
+      .flat()
+      .map((route) => route.$isOpened),
+    // @ts-expect-error
+    (...isOpened) => isOpened.some(Boolean)
+  );
+
+  const NotFound = config.notFound;
+
+  return () => {
+    const isSomeOpened = useStore($isSomeOpened);
+
+    if (!isSomeOpened && NotFound) {
+      return <NotFound />;
+    }
+    return (
+      <>
+        {views.map((View, idx) => (
+          <View key={idx} />
+        ))}
+      </>
+    );
+  };
+};

src/index.tsx

@@ -1,3 +1,5 @@
 export * from './link';
 export * from './route';
 export * from './router-provider';
+export * from './create-route-view';
+export * from './create-routes-view';