fix: Added better placeholder text and updated docs

This closes #1, closes #4, and closes #5
whyvra · Jan 10, 2021 · b1709e0 · b1709e0
1 parent 5887fe9
commit b1709e0
Show file tree

Hide file tree

Showing 8 changed files with 195 additions and 12 deletions.
diff --git a/.github/ISSUE_TEMPLATE/01_bug_report.md b/.github/ISSUE_TEMPLATE/01_bug_report.md
@@ -0,0 +1,37 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+<!-- This is just a template - feel free to delete any and all of it and replace as appropriate. -->
+
+### Description
+
+<!--
+* Please share a clear and concise description of the problem.
+* Include minimal steps to reproduce the problem if possible. E.g.: the smallest possible code snippet; or a small repo to clone, with steps to run it.
+  -->
+
+### Current Behavior
+<!-- Tell us what happens instead of the expected behavior -->
+
+### Expected Behavior
+<!-- Tell us what should happen -->
+
+### Steps to Reproduce
+<!--
+* Include minimal steps to reproduce the problem if possible. E.g.: the smallest possible code snippet; or a small repo to clone, with steps to run it.
+  -->
+1.
+2.
+3.
+4.
+
+### Context (Environment)
+<!-- How is your environment configured? Do you have any logs of the error -->
+<!-- How has this issue affected you? What are you trying to accomplish? -->
+<!-- Providing context helps us come up with a solution that is most useful in the real world -->
diff --git a/README.md b/README.md
@@ -9,6 +9,19 @@ The secure manager for your WireGuard clients
 
 <img src="https://raw.githubusercontent.com/whyvra/tunnel/master/docs/sample.gif" width="900">
 
+## Table of contents
+
+* [Purpose](#purpose)
+* [Usage](#usage)
+* [Configuration](#configuration)
+* [API settings](#api-settings)
+* [Blazor settings](#blazor-settings)
+* [SSL](#ssl)
+* [Database](#database)
+* [Authentication](#authentication)
+* [docker-compose](#docker-compose)
+* [License](#license)
+
 ## Purpose
 
 Tunnel is a secure manager for your WireGuard clients' configuration. It is not meant to manage your server's and your clients' private keys. Your server's private key should be stored securely on your server and your clients' private keys should be stored on their devices only. Tunnel does not automatically update your WireGuard configuration on the file system nor does it manage the WireGuard services.
@@ -22,7 +35,7 @@ The QR Code and WireGuard config file are only available when you first add the
 The simplest way to get started is to use the docker image.
 
 ```bash
-docker run --it --rm -p "5800:5800" whyvra/tunnel
+docker run -it --rm -p "5800:5800" whyvra/tunnel
 ```
 
 You should now be able to access tunnel via `http://localhost:5800/`
@@ -142,6 +155,108 @@ The `responseType` parameter is only required for the Blazor settings. It will d
 
 Please note that if you have an SSL certificate issued by a custom or internal CA on your Open ID connect server, you will need to add or mount the root CA certificate under `/etc/ssl/certs`.
 
+## docker-compose
+
+Detailed below is a docker-compose example making use of PostgreSQL as the backend database and Keycloak (Open ID Connect server) for authentication. This example has been tested using `docker stack`.
+
+### Folder structure:
+```
+.
+├── appsettings.json
+├── data (data folder for tunnel)
+├── docker-compose.yml
+├── init_script.sql
+├── pgdata (folder for postgres data)
+└── ssl
+    ├── tls.crt
+    └── tls.key
+```
+
+The `tls.crt` and `tls.key` can be generated with the following commands. Please note that the certificate should answer to `keycloak.lan` or whatever hostname you choose to replace it with.
+
+```bash
+$ openssl genpkey -algorithm RSA -pkeyopt rsa_keygen_bits:4096 -out tls.key
+$ openssl req -key tls.key -x509 -new -days 720 -out tls.crt
+```
+
+```yaml
+# docker-compose.yml
+version: '3.5'
+
+services:
+
+  postgres:
+    image: postgres:13-alpine
+    hostname: postgres
+    environment:
+    - POSTGRES_PASSWORD=postgres
+    - PGDATA=/var/lib/postgresql/data/pgdata
+    volumes:
+    - ./pgdata:/var/lib/postgresql/data/pgdata
+    - ./init_script.sql:/docker-entrypoint-initdb.d/init_script.sql
+
+  keycloak:
+    image: jboss/keycloak:latest
+    hostname: keycloak
+    depends_on:
+    - postgres
+    environment:
+    - DB_VENDOR=postgres
+    - DB_ADDR=postgres
+    - DB_PORT=5432
+    - DB_USER=postgres
+    - DB_PASSWORD=postgres
+    - KEYCLOAK_USER=admin
+    - KEYCLOAK_PASSWORD=admin
+    - KEYCLOAK_LOGLEVEL=WARN
+    - ROOT_LOGLEVEL=WARN
+    volumes:
+    - ./ssl:/etc/x509/https
+    ports:
+    - "8443:8443"
+
+  tunnel:
+    image: whyvra/tunnel:0.1
+    hostname: wg-tunnel
+    depends_on:
+    - postgres
+    - keycloak
+    environment:
+    - database__type=postgres
+    - ConnectionStrings__TunnelContext=Host=postgres;Database=tunnel;Username=postgres;Password=postgres;
+    - auth__enabled=true
+    - auth__authority=https://keycloak.lan:8443/auth/realms/apps
+    - auth__clientId=wg_tunnel
+    - auth__requiredRole=wg_admin
+    volumes:
+    - ./data:/data:rw
+    - ./appsettings.json:/srv/www/appsettings.json
+    - ./ssl/tls.crt:/etc/ssl/certs/tls.crt
+    ports:
+    - "5800:5800"
+```
+
+```json
+// appsettings.json
+{
+  "api": {
+    "url": "/api"
+  },
+  "auth": {
+    "authority": "https://keycloak.lan:8443/auth/realms/apps",
+    "clientId": "wg_tunnel",
+    "enabled": true,
+    "requiredRole": "wg_admin"
+  }
+}
+```
+
+```sql
+# init_script.sql
+CREATE DATABASE keycloak;
+CREATE DATABASE tunnel;
+```
+
 ## License
 
-Released under the [MIT License](https://github.com/whyvra/tunnel/blob/master/LICENSE).
+Released under the [MIT License](https://github.com/whyvra/tunnel/blob/master/LICENSE).
diff --git a/Whyvra.Blazor.Forms/FormBuilder.cs b/Whyvra.Blazor.Forms/FormBuilder.cs
@@ -97,12 +97,14 @@ public FormBuilder<TModel> Input<TProperty>(Expression<Func<TModel, TProperty>>
             var name = propertyInfo.Name;
 
             var exprPath = propertyLambda.ToString();
+            var displayName = AddSpaces(name);
 
             var input = new Input
             {
                 Name = name,
-                DisplayName = AddSpaces(name),
+                DisplayName = displayName,
                 Getter = propertyLambda.GetGetter(),
+                Placeholder = displayName,
                 Setter = propertyLambda.GetSetter(),
                 ValidationPath = exprPath.Substring(exprPath.IndexOf('.') + 1)
             };
@@ -185,12 +187,14 @@ public FormBuilder<TModel> TagsInput<TProperty>(Expression<Func<TModel, TPropert
             var name = propertyInfo.Name;
 
             var exprPath = propertyLambda.ToString();
+            var displayName = AddSpaces(name);
 
             var tags = new TagsInput
             {
                 Name = name,
-                DisplayName = AddSpaces(name),
+                DisplayName = displayName,
                 Getter = propertyLambda.GetGetter(),
+                Placeholder = displayName,
                 Setter = propertyLambda.GetSetter(),
                 ValidationPath = exprPath.Substring(exprPath.IndexOf('.') + 1)
             };
@@ -208,13 +212,15 @@ public FormBuilder<TModel> TextArea<TProperty>(Expression<Func<TModel, TProperty
             var name = propertyInfo.Name;
 
             var exprPath = propertyLambda.ToString();
+            var displayName = AddSpaces(name);
 
             var input = new TextArea
             {
                 Name = name,
                 Columns = columns,
                 DisplayName = AddSpaces(name),
                 Getter = propertyLambda.GetGetter(),
+                Placeholder = displayName,
                 Rows = rows,
                 Setter = propertyLambda.GetSetter(),
                 ValidationPath = exprPath.Substring(exprPath.IndexOf('.') + 1)
@@ -262,12 +268,24 @@ public FormBuilder<TModel> WithModel(TModel model)
             return this;
         }
 
+        public FormBuilder<TModel> WithPlaceholder(string placeholder)
+        {
+            var field = _fields[_activeField];
+            if (field is Input input)
+            {
+                input.Placeholder = placeholder;
+            }
+
+            return this;
+        }
+
         public FormBuilder<TModel> WithText(string text)
         {
             var field = _fields[_activeField];
             if (field is Input input)
             {
                 input.DisplayName = text;
+                input.Placeholder = text;
             }
 
             return this;

diff --git a/Whyvra.Blazor.Forms/Infrastructure/Input.cs b/Whyvra.Blazor.Forms/Infrastructure/Input.cs
@@ -18,6 +18,8 @@ public class Input : Field
 
         public EventHandler<ChangeEventArgs> OnChangeHandler { get; set; }
 
+        public string Placeholder { get; set; }
+
         public IEnumerable<string> ValidationMessages { get; set; } = new List<string>();
 
         public string ValidationPath { get; set; }

diff --git a/Whyvra.Blazor.Forms/Renderer/BulmaForm.razor b/Whyvra.Blazor.Forms/Renderer/BulmaForm.razor
@@ -14,7 +14,7 @@
                 <label for="@(field.Name)">@(field.DisplayName)</label>
                 <div class="control">
                     <textarea id="@(field.Name)" class="textarea has-fixed-size @(FormViewMode == FormViewMode.Readonly ? "is-static" : "")"
-                        placeholder="@(field.DisplayName)" value="@(field.Getter(FormModel.DataModel) ?? string.Empty)"
+                        placeholder="@(field.Placeholder)" value="@(field.Getter(FormModel.DataModel) ?? string.Empty)"
                         @onchange="@(async (e) => await HandleChange(field, e))" readonly="@(FormViewMode == FormViewMode.Readonly)"
                         rows="@(area.Rows.HasValue ? $"{area.Rows.Value}" : "")"
                         columns="@(area.Columns.HasValue ? $"{area.Columns.Value}" : "")"
@@ -36,7 +36,7 @@
                         Data="@(field.Getter(FormModel.DataModel) as IEnumerable<string>)"
                         EmptyValue="@tag.EmptyValue"
                         IsReadOnly="@(FormViewMode == FormViewMode.Readonly)"
-                        Placeholder="@(tag.DisplayName)"
+                        Placeholder="@(tag.Placeholder)"
                         DataChanged="@((tags) => tag.Setter(FormModel.DataModel, tags))" />
                     @if (_isValidationEnabled)
                     {
@@ -64,7 +64,7 @@
                 <label for="@(field.Name)">@(field.DisplayName)</label>
                 <p class="control @(field.Icon != null ? "has-icons-left" : "")">
                     <input id="@(field.Name)" class="input @(FormViewMode == FormViewMode.Readonly ? "is-static" : "")" type="number"
-                        placeholder="@(field.DisplayName)" value="@(field.Getter(FormModel.DataModel))"
+                        placeholder="@(field.Placeholder)" value="@(field.Getter(FormModel.DataModel))"
                         @onchange="@((e) => HandleNumber(number, e))" readonly="@(FormViewMode == FormViewMode.Readonly)"
                         @onfocusout="@(() => TriggerValidation(field))" >
                     @if (field.Icon != null)
@@ -85,7 +85,7 @@
                 <label for="@(field.Name)">@(field.DisplayName)</label>
                 <p class="control @(field.Icon != null ? "has-icons-left" : "")">
                     <input id="@(field.Name)" class="input @(FormViewMode == FormViewMode.Readonly ? "is-static" : "")" type="text"
-                        placeholder="@(field.DisplayName)" value="@(field.Getter(FormModel.DataModel))"
+                        placeholder="@(field.Placeholder)" value="@(field.Getter(FormModel.DataModel))"
                         @onchange="@(async (e) => await HandleChange(field, e))" readonly="@(FormViewMode == FormViewMode.Readonly)"
                         @onfocusout="@(() => TriggerValidation(field))" >
                     @if (field.Icon != null)

diff --git a/Whyvra.Tunnel.Api/Filters/HttpExceptionFilter.cs b/Whyvra.Tunnel.Api/Filters/HttpExceptionFilter.cs
@@ -1,12 +1,20 @@
 using System;
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.AspNetCore.Mvc.Filters;
+using Microsoft.Extensions.Logging;
 using Whyvra.Tunnel.Common.Models;
 
 namespace Whyvra.Tunnel.Api.Filters
 {
     public class HttpExceptionFilter : IExceptionFilter
     {
+        private readonly ILogger<HttpExceptionFilter> _logger;
+
+        public HttpExceptionFilter(ILogger<HttpExceptionFilter> logger)
+        {
+            _logger = logger;
+        }
+
         public void OnException(ExceptionContext context)
         {
             if (context.Exception.GetType() == typeof(NullReferenceException))
@@ -27,6 +35,9 @@ public void OnException(ExceptionContext context)
             }
             else
             {
+                // Log exception
+                _logger.LogError(context.Exception, "An unexpected error occured.");
+
                 var error = new ApiMessage {Message = context.Exception.Message, Status = "Inner Server Error", StatusCode = 500};
                 if (context.Exception.InnerException != null)
                 {

diff --git a/Whyvra.Tunnel.Api/Startup.cs b/Whyvra.Tunnel.Api/Startup.cs
@@ -51,7 +51,7 @@ public void ConfigureServices(IServiceCollection services)
                 AddControllers(x =>
                 {
                     x.Conventions.Add(new RouteTokenTransformerConvention(new SlugifyParameterTransformer()));
-                    x.Filters.Add(new HttpExceptionFilter());
+                    x.Filters.Add<HttpExceptionFilter>();
                     x.Filters.Add(new ValidationFilter());
                     if (authOptions.Enabled)
                     {

diff --git a/Whyvra.Tunnel.Presentation/Forms/ServerForm.razor b/Whyvra.Tunnel.Presentation/Forms/ServerForm.razor
@@ -116,10 +116,10 @@ else if (_formModel != null)
         fb
             .Input(x => x.Server.Name).WithIcon("server")
             .TextArea(x => x.Server.Description, rows: 3)
-            .Input(x => x.Server.AssignedRange).WithText("Assigned IP Range").WithIcon("network-wired")
-            .TagsInput(x => x.DefaultAllowedRange).WithDefaultEmptyValue("No IP range has been assigned")
+            .Input(x => x.Server.AssignedRange).WithText("Assigned IP Range").WithIcon("network-wired").WithPlaceholder("e.g. 10.200.10.0/24")
+            .TagsInput(x => x.DefaultAllowedRange).WithDefaultEmptyValue("No IP range has been assigned").WithPlaceholder("Comma-seperated list of address ranges e.g. 0.0.0.0/0, ::/0,")
             .Input(x => x.Server.Dns).WithText("DNS").WithIcon("address-book")
-            .Input(x => x.Server.Endpoint).WithIcon("globe")
+            .Input(x => x.Server.Endpoint).WithIcon("globe").WithPlaceholder("<IP Address | domain>:<port number> e.g. domain.xyz:53")
             .Number(x => x.Server.ListenPort).WithText("Port to listen").WithIcon("ethernet")
             .Input(x => x.Server.PublicKey).WithIcon("key");