fix: react router nopeification

packages/entity-persea/src/controllers/entity/component.jsx

@@ -9,7 +9,6 @@ import {
   useFlecks,
   useState,
 } from '@flecks/react';
-import {useParams} from '@flecks/react/router';
 import {
   Tab,
   Tabs,
@@ -23,9 +22,9 @@ import View from './view';
 const EntityComponent = ({
   resource,
   path,
+  uri,
 }) => {
   const flecks = useFlecks();
-  const {uri} = useParams();
   const {Entity, EntityList} = flecks.get('$avocado/resource.resources');
   const [entity, setEntity] = useState();
   useEffect(() => {
@@ -89,10 +88,11 @@ EntityComponent.defaultProps = {
 EntityComponent.displayName = 'EntityComponent';
 
 EntityComponent.propTypes = {
+  path: PropTypes.string,
   resource: PropTypes.shape({
     traits: PropTypes.shape({}),
   }).isRequired,
-  path: PropTypes.string,
+  uri: PropTypes.string.isRequired,
 };
 
 export default EntityComponent;

packages/resource-persea/src/components/resource/index.jsx

@@ -4,14 +4,12 @@ import {
   PropTypes,
   React,
 } from '@flecks/react';
-import {useParams} from '@flecks/react/router';
 
 import useResourceController from '../../hooks/use-resource-controller';
 
 import locals from './index.module.scss';
 
-const Resource = ({resource}) => {
-  const {uri} = useParams();
+const Resource = ({resource, uri}) => {
   const {Component} = useResourceController(uri);
   let displayedUri = basename(uri);
   if (0 === displayedUri.indexOf('index')) {
@@ -19,7 +17,7 @@ const Resource = ({resource}) => {
   }
   return (
     <div className={locals.resource}>
-      <Component resource={resource} />
+      <Component resource={resource} uri={uri} />
       <div className={locals.uri}>{displayedUri}</div>
     </div>
   );
@@ -30,6 +28,7 @@ Resource.displayName = 'Resource';
 Resource.propTypes = {
   // eslint-disable-next-line react/forbid-prop-types
   resource: PropTypes.any.isRequired,
+  uri: PropTypes.string.isRequired,
 };
 
 export default Resource;