diff --git a/docs/docs/intro.md b/docs/docs/intro.md
deleted file mode 100644
index 45e8604c..00000000
--- a/docs/docs/intro.md
+++ /dev/null
@@ -1,47 +0,0 @@
----
-sidebar_position: 1
----
-
-# Tutorial Intro
-
-Let's discover **Docusaurus in less than 5 minutes**.
-
-## Getting Started
-
-Get started by **creating a new site**.
-
-Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**.
-
-### What you'll need
-
-- [Node.js](https://nodejs.org/en/download/) version 18.0 or above:
- - When installing Node.js, you are recommended to check all checkboxes related to dependencies.
-
-## Generate a new site
-
-Generate a new Docusaurus site using the **classic template**.
-
-The classic template will automatically be added to your project after you run the command:
-
-```bash
-npm init docusaurus@latest my-website classic
-```
-
-You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor.
-
-The command also installs all necessary dependencies you need to run Docusaurus.
-
-## Start your site
-
-Run the development server:
-
-```bash
-cd my-website
-npm run start
-```
-
-The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there.
-
-The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/.
-
-Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes.
diff --git a/docs/docs/providers.md b/docs/docs/providers.md
index 479dc834..5cf1af39 100644
--- a/docs/docs/providers.md
+++ b/docs/docs/providers.md
@@ -20,6 +20,40 @@ It has one mandatory prop: `mapping`. This is the mapping of your schema to the
Further it has an optional prop: `syncServerUri`. This is the URL of the sync server. By default it is set to `https://hypergraph.fly.dev`.
+## useHypergraphApp
+
+The `useHypergraphApp` is available inside the `HypergraphAppProvider` and manages the sync server connection and provides serveral useful functions.
+
+```tsx
+import { useHypergraphApp } from "@graphprotocol/hypergraph-react";
+
+const App = () => {
+ const { isConnected, logout } = useHypergraphApp();
+ return
{isConnecting ? "Connecting..."}
;
+};
+```
+
+- `isConnected` is a boolean that indicates that syncing private spaces is not yet possible. You need to wait until it's `false` to query data from private spaces.
+- `logout` is a function that logs out the user.
+
+There are serveral more that will be explained in the following sections.
+
+## useHypergraphAuth
+
+The `useHypergraphAuth` is available inside the `HypergraphAppProvider` and manages the authentication state and provides serveral useful functions.
+
+```tsx
+import { useHypergraphAuth } from "@graphprotocol/hypergraph-react";
+
+const App = () => {
+ const { authenticated, identity } = useHypergraphAuth();
+ return
;
+};
+```
+
+- `authenticated` is a boolean that indicates if the user is authenticated.
+- `identity` is the identity of the logged in user.
+
## HypergraphSpaceProvider
Whenever interact with a space you need to provide the space ID. In order providing the space ID to every hook e.g. useSpace, useQuery, useCreateEntity, etc. you can use the `HypergraphSpaceProvider` to wrap a section of your app with the space ID.
@@ -45,3 +79,4 @@ const SpaceDetails = () => {
```
The `space` prop is the ID of the space. It can be a private or public space.
+
diff --git a/docs/docs/publishing-public-data.md b/docs/docs/publishing-public-data.md
index c174e050..04af3956 100644
--- a/docs/docs/publishing-public-data.md
+++ b/docs/docs/publishing-public-data.md
@@ -2,39 +2,69 @@
Once you want to share your data with the world you need to publish it. This is done by creating the necessary `Opertations` (Ops) and then publishing them.
-## Prepare Publish (not yet supported)
+## Prepare Publish
Based on entity Ids, the source space and the target space this function calculates the necessary `Operations` to publish the data.
```tsx
import { preparePublish } from "@graphprotocol/hypergraph-react";
-const { ops, diff } = preparePublish({
- entityIds: ["entity-id-1", "entity-id-2"],
- privateSourceSpace: "private-source-space-id",
- publicTargetSpace: "public-target-space-id",
+const { ops } = preparePublish({
+ entity: entity,
+ publicSpace: "public-space-id",
});
```
-## Publishing Relations
+The entity can come from a `useCreateEntity` result or from a `useQuery` result e.g.
```tsx
-import { publishOps } from '@graphprotocol/hypergraph-react';
+const MyComponent = () => {
+ const { data: events } = useQuery(Event, { mode: "private" });
+
+ const createOpsForPublishing = async (event) => {
+ const { ops } = preparePublish({
+ entity: event,
+ publicSpace: "public-space-id",
+ });
+ };
+
+ return (
+