{"id":29443610,"url":"https://github.com/mejaz/spicedb-ui","last_synced_at":"2026-06-23T00:04:02.097Z","repository":{"id":298523426,"uuid":"1000266788","full_name":"mejaz/spicedb-ui","owner":"mejaz","description":"A modern web interface for managing SpiceDB authorization systems. Built with Next.js and Tailwind CSS.","archived":false,"fork":false,"pushed_at":"2025-07-08T06:43:03.000Z","size":279,"stargazers_count":4,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-08T07:48:22.261Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mejaz.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-11T14:11:13.000Z","updated_at":"2025-07-08T06:43:07.000Z","dependencies_parsed_at":null,"dependency_job_id":"18a68d8e-deb7-4f2f-a33c-794c32e1fa2d","html_url":"https://github.com/mejaz/spicedb-ui","commit_stats":null,"previous_names":["mejaz/spicedb-ui"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mejaz/spicedb-ui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mejaz%2Fspicedb-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mejaz%2Fspicedb-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mejaz%2Fspicedb-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mejaz%2Fspicedb-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mejaz","download_url":"https://codeload.github.com/mejaz/spicedb-ui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mejaz%2Fspicedb-ui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34669852,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-22T02:00:06.391Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-07-13T17:00:30.381Z","updated_at":"2026-06-23T00:04:02.092Z","avatar_url":"https://github.com/mejaz.png","language":"JavaScript","funding_links":[],"categories":["Developer Tools"],"sub_categories":["Third-party Tools"],"readme":"# SpiceDB UI\n\nA modern web interface for managing SpiceDB authorization systems. Built with Next.js and Tailwind CSS.\n\n## Screenshots\n\u003cdiv align=\"center\"\u003e\n  \u003ctable\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/dashboard.jpg\" width=\"350\" alt=\"Dashboard\"\u003e\n        \u003cbr\u003e\u003cem\u003eDashboard\u003c/em\u003e\n      \u003c/td\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/schema.jpg\" width=\"350\" alt=\"Schema View\"\u003e\n        \u003cbr\u003e\u003cem\u003eSchema Management\u003c/em\u003e\n      \u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/relationships.jpg\" width=\"350\" alt=\"Relationships\"\u003e\n        \u003cbr\u003e\u003cem\u003eEntity Relationships\u003c/em\u003e\n      \u003c/td\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/permissions.jpg\" width=\"350\" alt=\"Permissions\"\u003e\n        \u003cbr\u003e\u003cem\u003ePermission Management\u003c/em\u003e\n      \u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/permissions-bulk.jpg\" width=\"350\" alt=\"Bulk Permissions\"\u003e\n        \u003cbr\u003e\u003cem\u003eBulk Operations\u003c/em\u003e\n      \u003c/td\u003e\n      \u003ctd align=\"center\"\u003e\n        \u003cimg src=\"snaps/auth-expand.jpg\" width=\"350\" alt=\"Authentication\"\u003e\n        \u003cbr\u003e\u003cem\u003eAuthentication Details\u003c/em\u003e\n      \u003c/td\u003e\n    \u003c/tr\u003e\n  \u003c/table\u003e\n\u003c/div\u003e\n\n## Features\n\n- **Dashboard** - Real-time overview of your SpiceDB instance with stats and activity\n- **Schema Management** - Visual and text-based schema editor with validation\n- **Relationship Management** - CRUD operations with smart dropdowns and search\n- **Authorization Testing** - Permission checks, expansions, and subject lookups\n\n## Prerequisites\n\n- Node.js 16+\n- Running SpiceDB instance (HTTP API enabled)\n\n## Quick Start\n\n1. **Clone and install**\n   ```bash\n   git clone https://github.com/mejaz/spicedb-ui.git\n   cd spicedb-ui\n   npm install\n   ```\n\n2. **Start SpiceDB with HTTP API**\n   ```bash\n   docker run -d --rm -p 50051:50051 -p 8443:8443 \\\n     authzed/spicedb serve \\\n     --grpc-preshared-key \"your-token-here\" \\\n     --http-enabled\n   ```\n\n3. **Configure environment**\n   ```bash\n   # Create .env.local\n   SPICEDB_URL=http://localhost:8443\n   SPICEDB_TOKEN=your-token-here\n   ```\n\n4. **Start the UI**\n   ```bash\n   npm run dev\n   ```\n\n   Open [http://localhost:3000](http://localhost:3000)\n\n### Run with Docker\n\n1. **Build the Docker image**\n   ```bash\n   docker build -t spicedb-ui .\n   ```\n\n2. **Configure environment variables**\n\n   Create a `.env` file in the project root:\n   ```bash\n   # .env\n   SPICEDB_URL=http://host.docker.internal:8443\n   SPICEDB_TOKEN=your-token-here\n   ```\n\n   \u003e **Note**: Use `host.docker.internal` to connect to services running on your host machine from within the Docker container.\n\n3. **Run the container**\n   ```bash\n   docker run --env-file .env -p 3000:3000 spicedb-ui\n   ```\n\n4. **Access the application**\n\n   Open your browser and navigate to `http://localhost:3000`\n\n---\n\n**Alternative: Using Docker Compose**\n\nFor easier management, you can also use Docker Compose:\n\n```yaml\n# docker-compose.yml\nversion: '3.8'\nservices:\n  spicedb-ui:\n    build: .\n    ports:\n      - \"3000:3000\"\n    environment:\n      - SPICEDB_URL=http://host.docker.internal:8443\n      - SPICEDB_TOKEN=your-token-here\n```\n\nThen run:\n```bash\ndocker-compose up --build\n```\n\n## Configuration\n\nEnvironment variables in `.env.local`:\n\n```bash\nSPICEDB_URL=http://localhost:8443    # SpiceDB HTTP API endpoint\nSPICEDB_TOKEN=your-token-here        # Pre-shared key for authentication\n```\n\n## Usage\n\n### 1. Schema Management\n- Navigate to **Schema** page\n- Edit your authorization model using SpiceDB schema language\n- Use the visual view to see parsed namespaces, relations, and permissions\n- Save changes directly to SpiceDB\n\n### 2. Relationship Management\n- Go to **Relationships** page\n- Add relationships using smart dropdowns:\n    - **Resource**: Search existing or create new (e.g., `business:acme-corp`)\n    - **Relation**: Auto-populated from your schema (e.g., `owner`, `manager`)\n    - **Subject**: Manual entry (e.g., `user:alice`)\n- View, search, and filter existing relationships\n\n### 3. Authorization Testing\n- Use **Check** page for permission testing:\n    - **Permission Check**: Test if a subject has permission on a resource\n    - **Expand Permission**: Visualize permission trees\n    - **Lookup Subjects**: Find all subjects with a specific permission\n\n\n## Example Schema\n\n```javascript\ndefinition user {}\n\ndefinition business {\n  relation owner: user\n  relation manager: user\n  relation read_access: user\n  \n  permission issue_invoices = owner + manager\n  permission view_invoice_list = read_access + owner + manager\n  permission modify_invoices = owner + manager\n}\n\ndefinition system {\n  relation admin: user\n  permission global_admin = admin\n}\n```\n\n## API Endpoints\n\nThe UI creates several API routes:\n\n- `GET /api/spicedb/stats` - Dashboard statistics\n- `GET /api/spicedb/health` - Connection health check\n- `GET /api/spicedb/activity` - Recent activity feed\n- `GET /api/spicedb/resources` - Available resources and relations\n- `GET|POST /api/spicedb/schema` - Schema management\n- `GET|POST|DELETE /api/spicedb/relationships` - Relationship CRUD\n- `POST /api/spicedb/check` - Permission checking\n- `POST /api/spicedb/expand` - Permission expansion\n- `POST /api/spicedb/lookup-subjects` - Subject lookup\n\n## Tech Stack\n\n- **Frontend**: Next.js 13+, React, Tailwind CSS\n- **Backend**: Next.js API routes\n- **Database**: SpiceDB (via HTTP API)\n- **Styling**: Tailwind CSS with custom components\n\n## Development\n\n```bash\nnpm run dev      # Start development server\nnpm run build    # Build for production\nnpm start        # Start production server\n```\n\n## Contributing\n\n1. Fork the repository\n2. Create a feature branch\n3. Make your changes\n4. Test with your local SpiceDB instance\n5. Submit a pull request\n\n## License\n\nMIT\n\n## Links\n\n- [SpiceDB Documentation](https://authzed.com/docs)\n- [SpiceDB GitHub](https://github.com/authzed/spicedb)\n- [Next.js Documentation](https://nextjs.org/docs)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmejaz%2Fspicedb-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmejaz%2Fspicedb-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmejaz%2Fspicedb-ui/lists"}