Reorganized files

docs/blazor/authorization.md

@@ -0,0 +1,20 @@
+# HopFrame Authentication
+
+With the provided HopFrame services, you can secure your blazor pages so that only logged-in users or users with the right permissions can access the page.
+
+## Usage
+You can secure your Blazor pages by using the `AuthorizedView` component.
+Everything placed inside this component will only be displayed if the authorization was successful.
+You can also redirect the user if the authorization fails by specifying a `RedirectIfUnauthorized` url.
+
+```html
+<!-- You can either specify one 'Permission', multiple 'Permissions' or none if the user only needs to be logged-in -->
+<AuthorizedView Permission="test.permission">
+    <p>This paragraph is only visible if the user is logged-in and has the required permission</p>
+</AuthorizedView>
+```
+
+```html
+<!-- This component will redirect the user to the login page if the user is unauthorized -->
+<AuthorizedView RedirectIfUnauthorized="/login" />
+```

docs/blazor/installation.md

@@ -0,0 +1,36 @@
+## How to use the Blazor API
+This Installation adds all HopFrame [pages](./pages.md) and [services](./services.md) to the application.
+
+1. Add the HopFrame.Web library to your project
+
+   ```
+   dotnet add package HopFrame.Web
+   ```
+
+2. Create a [DbContext](../database.md) that inherits the ``HopDbContext`` and add a data source
+
+3. Add the HopFrame services to your application, provide the previously created `DatabaseContext` that inherits from `HopDbContextBase`
+
+   ```csharp
+   builder.Services.AddHopFrame<DatabaseContext>();
+   ```
+   
+4. **Optional:** You can also add your [AdminContext](./admin.md)
+
+   ```csharp
+   builder.Services.AddAdminContext<AdminContext>();
+   ```
+
+5. Add the authentication middleware to your app
+
+   ```csharp
+   app.UseMiddleware<AuthMiddleware>();
+   ```
+
+6. Add the HopFrame pages to your Razor components
+
+   ```csharp
+   app.MapRazorComponents<App>()
+    .AddHopFrameAdminPages()
+    .AddInteractiveServerRenderMode();
+   ```