Improve doc

README.md

@@ -6,7 +6,7 @@ Data, auth and live providers that can be used in any [Refine](https://refine.de
 
 > For a quick overview, have a look at our [example app](./examples/antd-app/).
 
-Refine relies on the concept of "resources", which are data types, to manage your application in a structured way. On the other side, NextGraph identifies data types using [ShEx shapes](https://shex.io/) which are transformed into "shape types" using [its own tool](https://docs.nextgraph.org/en/reference/shex-orm/). So naturally our data provider needs to receive a list of shape types in order to identify resources.
+Refine relies on the concept of "resources" (which are data types) to manage your application in a structured way. On the other side, NextGraph identifies data types using [ShEx shapes](https://shex.io/) which are transformed into "shape types" using [its own tool](https://docs.nextgraph.org/en/reference/shex-orm/). So naturally our data provider needs to receive a list of shape types in order to identify resources.
 
 ### 1. Define your shapes
 
@@ -54,7 +54,11 @@ const shapeTypes : ShapeTypes = {
 export default shapeTypes;
 ```
 
-### 3. Add the providers to Refine
+### 3. Configure the providers
+
+Add the providers to Refine. The live provider is optional, but it will allow you to sync data
+if several users are working on the same data. See the example app for how to handle this correctly
+in the edit and view pages.
 
 ```tsx
 import { authProvider, dataProvider, liveProvider } from "@ng-org/refine-providers";
@@ -107,4 +111,5 @@ export const PostList = () => {
 ```bash
 pnpm build
 pnpm watch
+pnpm publish
 ```

examples/antd-app/index.html

@@ -5,11 +5,7 @@
         <link rel="icon" href="/favicon.ico" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <meta name="theme-color" content="#000000" />
-        <meta name="description" content="Web site created using refine" />
+        <meta name="description" content="Web site created using Refine" />
-        <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
         <link rel="manifest" href="/manifest.json" />
         <title>refine authentication example</title>
     </head>
@@ -17,14 +13,5 @@
         <noscript>You need to enable JavaScript to run this app.</noscript>
         <div id="root"></div>
         <script type="module" src="/src/index.tsx"></script>
-        <!--
+    </body>
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm run dev` or `yarn dev`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    --></body>
 </html>

src/index.ts

@@ -1,8 +1,7 @@
-export { default as authProvider } from "./auth-provider";
-export * from "./auth-provider";
-
 export { default as dataProvider } from "./data-provider";
 export { default as liveProvider } from "./live-provider";
+export { default as authProvider } from "./auth-provider";
 
+export * from "./auth-provider";
 export * from "./types";
 export * from "./utils";

src/utils.ts

@@ -1,8 +1,9 @@
 import { BaseKey } from "@refinedev/core";
 import { RdfOrmSubscription } from "@ng-org/orm";
-import type { ShapeType } from "@ng-org/shex-orm";
+import { ShapeType } from "@ng-org/shex-orm";
 import { DeepSignalSet, DeepPatch } from "@ng-org/alien-deepsignals"
 
+// Helper function to retrieve the signal object and eventually close the subscription
 export const getSignalObject = async (shapeType: ShapeType<any>, ids?: string[], closeSubscription: boolean = true) : Promise<DeepSignalSet<any>> => {
   const subscription = RdfOrmSubscription.getOrCreate(shapeType, { graphs: ids || [''] });
   await subscription.readyPromise;
@@ -16,6 +17,7 @@ export const isGraphKey = (key: BaseKey): boolean => {
   return key !== null && typeof key === "string" && key.includes(":v:");
 }
 
+// Add the mandatory `id` property to the object, based on the `@graph` property.
 export const addIdToObject = (obj: any) => {
   if (!obj["@graph"]) {
     throw new Error("Object is missing @graph property");