Merge pull request #1 from stechstudio/feature/web-ui

Web UI Implementation with Template Management & Permissions System

Author: jszobody

.github/workflows/build-ui.yml

@@ -0,0 +1,57 @@
+name: Build Web UI
+
+on:
+  push:
+    branches: [ main, develop, feature/web-ui ]
+    paths:
+      - 'src/Server/frontend/**'
+      - '.github/workflows/build-ui.yml'
+  pull_request:
+    branches: [ main ]
+    paths:
+      - 'src/Server/frontend/**'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v4
+    
+    - name: Setup Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: '20'
+        cache: 'npm'
+        cache-dependency-path: src/Server/frontend/package-lock.json
+    
+    - name: Install dependencies
+      run: npm ci
+      working-directory: src/Server/frontend
+    
+    - name: Build UI
+      run: npm run build
+      working-directory: src/Server/frontend
+    
+    - name: Check build output
+      run: |
+        echo "Build artifacts:"
+        ls -la src/Server/public/assets/
+        echo "Total size:"
+        du -sh src/Server/public/
+    
+    - name: Upload build artifacts
+      uses: actions/upload-artifact@v4
+      with:
+        name: ui-build
+        path: src/Server/public/
+        retention-days: 7
+    
+    - name: Commit built assets
+      if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+      run: |
+        git config --local user.email "github-actions[bot]@users.noreply.github.com"
+        git config --local user.name "github-actions[bot]"
+        git add src/Server/public/
+        git diff --staged --quiet || git commit -m "Build: Update UI assets [skip ci]"
+        git push

.gitignore

@@ -2,8 +2,9 @@ composer.lock
 workbench/
 vendor/
 .env*
-*_PLAN.md
+env/
 CLAUDE.md
+*_PLAN.md
 .claude
 .keep
 node_modules

README.md

@@ -9,9 +9,10 @@
 ## Key Features
 
 - **🔐 Multi-Vault Support** - AWS SSM Parameter Store and AWS Secrets Manager
+- **🖥️ Web UI** - Modern browser-based interface for visual secret management
 - **🚀 Interactive Shell** - Context-aware shell with tab completion for rapid secret management
 - **🌍 Environment Isolation** - Separate secrets by stage (local, staging, production)
-- **📝 Template System** - Merge secrets into templates while preserving structure
+- **📝 Template Management** - Create, validate, and process templates with placeholders
 - **🔄 Bulk Operations** - Import, export, copy, and diff secrets across environments
 - **🤝 Team Collaboration** - Share secret management with proper access controls
 - **⚙️ CI/CD Ready** - Export secrets for deployment pipelines
@@ -34,6 +35,9 @@ composer require stechstudio/keep
 # Export to .env
 ./vendor/bin/keep export --stage=production --file=.env
 
+# Create template from existing secrets
+./vendor/bin/keep template:add .env.template --stage=production
+
 # Use template with placeholders
 ./vendor/bin/keep export --stage=production --template=.env.template --file=.env
 ```
@@ -61,6 +65,29 @@ ssm:production> diff staging production
 │ API_KEY │ abc...  │ abc...     │ ✓      │
 ```
 
+## Web UI
+
+Keep includes a modern web interface for visual secret management:
+
+```bash
+# Start the web server
+./vendor/bin/keep server
+
+# Custom port (default: 4000)
+./vendor/bin/keep server --port=8080
+
+# Don't auto-open browser
+./vendor/bin/keep server --no-browser
+```
+
+The Web UI provides:
+- **Visual secret management** with search and filtering
+- **Diff matrix view** comparing secrets across stages/vaults
+- **Export functionality** with live preview
+- **Import wizard** for .env files with conflict resolution
+- **Settings management** for vaults and stages
+- **Real-time validation** and error handling
+
 ## Documentation
 
 📚 **Full documentation available at [https://stechstudio.github.io/keep/](https://stechstudio.github.io/keep/)**

composer.json

@@ -21,11 +21,10 @@
     ],
     "require": {
         "php": "^8.3",
-        "ext-sodium": "*",
         "ext-readline": "*",
+        "ext-sodium": "*",
         "illuminate/console": "^12.0",
         "illuminate/container": "^12.0",
-        "illuminate/events": "^12.0",
         "illuminate/support": "^12.0",
         "laravel/prompts": "^0.3.0",
         "symfony/console": "^7.0",
@@ -48,8 +47,7 @@
     "autoload": {
         "psr-4": {
             "STS\\Keep\\": "src/"
-        },
-        "files": ["src/bootstrap.php"]
+        }
     },
     "autoload-dev": {
         "psr-4": {
@@ -63,7 +61,15 @@
         "lint": [
             "@php vendor/bin/phpstan analyse --verbose --ansi"
         ],
-        "format": "vendor/bin/pint --preset laravel"
+        "format": "vendor/bin/pint --preset laravel",
+        "ui:install": "cd src/Server/frontend && npm install",
+        "ui:build": "cd src/Server/frontend && npm run build",
+        "ui:dev": "cd src/Server/frontend && npm run dev",
+        "ui:clean": "cd src/Server/frontend && npm run clean",
+        "build": [
+            "@ui:install",
+            "@ui:build"
+        ]
     },
     "bin": ["bin/keep"],
     "config": {

docs/.vitepress/config.mjs

@@ -6,8 +6,20 @@ export default defineConfig({
 
     // Base URL for GitHub Pages (repository name)
     base: '/keep/',
+    
+    // Ignore dead links for now
+    ignoreDeadLinks: true,
+    
+    // Favicon - must include base path explicitly for head elements
+    head: [
+        ['link', { rel: 'icon', type: 'image/svg+xml', href: '/keep/logo.svg' }],
+        ['link', { rel: 'alternate icon', type: 'image/svg+xml', href: '/keep/logo.svg' }],
+        ['link', { rel: 'mask-icon', href: '/keep/logo.svg', color: '#000000' }]
+    ],
 
     themeConfig: {
+        // Logo in nav bar
+        logo: '/logo.svg',
         // GitHub repository
         socialLinks: [
             {icon: 'github', link: 'https://github.com/stechstudio/keep'}
@@ -16,8 +28,7 @@ export default defineConfig({
         // Navigation
         nav: [
             {text: 'Home', link: '/'},
-            {text: 'Guide', link: '/guide/'},
-            {text: 'Examples', link: '/examples/'}
+            {text: 'Guide', link: '/guide/'}
         ],
 
         // Sidebar
@@ -29,18 +40,35 @@ export default defineConfig({
                         {text: 'Introduction', link: '/guide/'},
                         {text: 'Installation', link: '/guide/installation'},
                         {text: 'Configuration', link: '/guide/configuration'},
-                        {text: 'Quick Start', link: '/guide/quick-start'},
-                        {text: 'Interactive Shell', link: '/guide/shell'}
+                        {text: 'Quick Start', link: '/guide/quick-start'}
                     ]
                 },
                 {
-                    text: 'Managing Secrets',
+                    text: 'CLI Commands',
                     items: [
-                        {text: 'Overview', link: '/guide/managing-secrets/'},
-                        {text: 'Creating & Viewing', link: '/guide/managing-secrets/creating-viewing'},
-                        {text: 'Cross-Environment', link: '/guide/managing-secrets/cross-environment'},
-                        {text: 'Exporting to .env', link: '/guide/managing-secrets/exporting-to-env'}
-                        // {text: 'Runtime Secrets', link: '/guide/managing-secrets/runtime-secrets'} // Deferred to future release
+                        {text: 'Overview', link: '/guide/cli-commands/'},
+                        {text: 'Creating & Viewing', link: '/guide/cli-commands/creating-viewing'},
+                        {text: 'Cross-Environment', link: '/guide/cli-commands/cross-environment'},
+                        {text: 'Exporting to .env', link: '/guide/cli-commands/exporting-to-env'}
+                        // {text: 'Runtime Secrets', link: '/guide/cli-commands/runtime-secrets'} // Deferred to future release
+                    ]
+                },
+                {
+                    text: 'Interactive Shell',
+                    items: [
+                        {text: 'Getting Started', link: '/guide/shell'},
+                        {text: 'Commands & Shortcuts', link: '/guide/shell-commands'},
+                        {text: 'Tips & Tricks', link: '/guide/shell-tips'}
+                    ]
+                },
+                {
+                    text: 'Web UI',
+                    items: [
+                        {text: 'Getting Started', link: '/guide/web-ui/'},
+                        {text: 'Managing Secrets', link: '/guide/web-ui/managing-secrets'},
+                        {text: 'Diff & Compare', link: '/guide/web-ui/diff-compare'},
+                        {text: 'Import & Export', link: '/guide/web-ui/import-export'},
+                        {text: 'Security', link: '/guide/web-ui/security'}
                     ]
                 },
                 {
@@ -59,18 +87,6 @@ export default defineConfig({
                         // {text: 'Security Architecture', link: '/guide/reference/security-architecture'} // Deferred - encrypted cache feature
                     ]
                 }
-            ],
-            '/examples/': [
-                {
-                    text: 'Examples',
-                    items: [
-                        {text: 'Overview', link: '/examples/'},
-                        // {text: 'Laravel Integration', link: '/examples/laravel'}, // Deferred to future release
-                        {text: 'CI/CD Workflows', link: '/examples/ci-cd'},
-                        {text: 'Multi-Environment Setup', link: '/examples/multi-environment'},
-                        {text: 'AWS Setup', link: '/examples/aws-setup'}
-                    ]
-                }
             ]
         },