@guillotinaweb/react-gmi 0.34.1 → 0.34.2

package/README.md

@@ -28,7 +28,7 @@ pnpm add @guillotinaweb/react-gmi
 `App.tsx`
 
 ```tsx
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import {
   Layout,
   Auth,
@@ -36,18 +36,26 @@ import {
   Login,
   getClient,
   ClientProvider,
+  GuillotinaClient,
 } from '@guillotinaweb/react-gmi'
-import '@guillotinaweb/react-gmi/dist/css/style.css'
+import '@guillotinaweb/react-gmi/css/style.css'
 
 // Guillotina server URL
 const url = 'http://localhost:8080'
-const schema = '/'
+const schemas = ['/db/container/']
 const auth = new Auth(url)
-const client = getClient(url, schema, auth)
 
 function App() {
+  const [currentSchema, setCurrentSchema] = useState('/db/container/')
+  const [clientInstance, setClientInstance] = useState<
+    GuillotinaClient | undefined
+  >(undefined)
   const [isLogged, setLogged] = useState(auth.isLogged)
 
+  useEffect(() => {
+    setClientInstance(getClient(url, currentSchema, auth))
+  }, [currentSchema])
+
   const onLogin = () => {
     setLogged(true)
   }
@@ -56,19 +64,30 @@ function App() {
     setLogged(false)
   }
 
-  auth.onLogout = onLogout
+  if (clientInstance === undefined) {
+    return null
+  }
 
   return (
-    <ClientProvider client={client}>
+    <ClientProvider client={clientInstance}>
       <Layout auth={auth} onLogout={onLogout}>
-        {isLogged && <Guillotina auth={auth} url={schema} />}
+        {isLogged && (
+          <Guillotina
+            auth={auth}
+            url={currentSchema}
+            locale="en"
+            registry={{}}
+          />
+        )}
         {!isLogged && (
           <div className="columns is-centered">
-            <div className="columns is-half">
+            <div className="column is-half">
               <Login
                 onLogin={onLogin}
                 auth={auth}
-                currentSchema={schema}
+                schemas={schemas}
+                currentSchema={currentSchema}
+                setCurrentSchema={setCurrentSchema}
               />
             </div>
           </div>

package/dist/react-gmi.js

@@ -768,13 +768,18 @@ function requireReactIs_development$1() {
   }
   return reactIs_development$1;
 }
-if (process.env.NODE_ENV === "production") {
-  reactIs$2.exports = requireReactIs_production_min$1();
-} else {
-  reactIs$2.exports = requireReactIs_development$1();
+var hasRequiredReactIs;
+function requireReactIs() {
+  if (hasRequiredReactIs) return reactIs$2.exports;
+  hasRequiredReactIs = 1;
+  if (process.env.NODE_ENV === "production") {
+    reactIs$2.exports = requireReactIs_production_min$1();
+  } else {
+    reactIs$2.exports = requireReactIs_development$1();
+  }
+  return reactIs$2.exports;
 }
-var reactIsExports$1 = reactIs$2.exports;
-var reactIs$1 = reactIsExports$1;
+var reactIs$1 = requireReactIs();
 var REACT_STATICS = {
   childContextTypes: true,
   contextType: true,
@@ -5882,7 +5887,7 @@ var hasRequiredFactoryWithTypeCheckers;
 function requireFactoryWithTypeCheckers() {
   if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
   hasRequiredFactoryWithTypeCheckers = 1;
-  var ReactIs = reactIsExports$1;
+  var ReactIs = requireReactIs();
   var assign = requireObjectAssign();
   var ReactPropTypesSecret = requireReactPropTypesSecret();
   var checkPropTypes = requireCheckPropTypes();
@@ -6355,7 +6360,7 @@ function requireFactoryWithThrowingShims() {
   return factoryWithThrowingShims;
 }
 if (process.env.NODE_ENV !== "production") {
-  var ReactIs = reactIsExports$1;
+  var ReactIs = requireReactIs();
   var throwOnDirectAccess = true;
   propTypes.exports = requireFactoryWithTypeCheckers()(ReactIs.isElement, throwOnDirectAccess);
 } else {