{"id":25953571,"url":"https://github.com/blaspsoft/keysmith-vue","last_synced_at":"2026-04-13T00:15:53.810Z","repository":{"id":280046806,"uuid":"940642145","full_name":"Blaspsoft/keysmith-vue","owner":"Blaspsoft","description":"Keysmith Vue is a Laravel 12 + Vue 3 package for managing API tokens with Laravel Sanctum. It provides pre-built Vue components for generating, viewing, and revoking API keys, offering a seamless and user-friendly authentication experience. 🚀🔑","archived":false,"fork":false,"pushed_at":"2025-03-01T22:12:42.000Z","size":16,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-01T22:16:37.894Z","etag":null,"topics":["api","api-token-management","api-tokens","apikey-manager","authentication","inertiajs","laravel","laravel-breeze","laravel-sanctum","laravel12","php","starter-kit","vue","vue3"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Blaspsoft.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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}},"created_at":"2025-02-28T14:36:44.000Z","updated_at":"2025-03-01T22:05:43.000Z","dependencies_parsed_at":"2025-03-01T22:16:38.604Z","dependency_job_id":null,"html_url":"https://github.com/Blaspsoft/keysmith-vue","commit_stats":null,"previous_names":["modla-dev/keysmith-vue","blaspsoft/keysmith-vue"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Blaspsoft%2Fkeysmith-vue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Blaspsoft%2Fkeysmith-vue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Blaspsoft%2Fkeysmith-vue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Blaspsoft%2Fkeysmith-vue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Blaspsoft","download_url":"https://codeload.github.com/Blaspsoft/keysmith-vue/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241871513,"owners_count":20034483,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["api","api-token-management","api-tokens","apikey-manager","authentication","inertiajs","laravel","laravel-breeze","laravel-sanctum","laravel12","php","starter-kit","vue","vue3"],"created_at":"2025-03-04T15:29:15.355Z","updated_at":"2026-04-13T00:15:53.099Z","avatar_url":"https://github.com/Blaspsoft.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n    \u003cimg src=\"./assets/icon.png\" alt=\"Blasp Icon\" width=\"150\" height=\"150\"/\u003e\n    \u003cp align=\"center\"\u003e\n        \u003ca href=\"https://packagist.org/packages/blaspsoft/keysmith-vue\"\u003e\u003cimg alt=\"Total Downloads\" src=\"https://img.shields.io/packagist/dt/blaspsoft/keysmith-vue\"\u003e\u003c/a\u003e\n        \u003ca href=\"https://packagist.org/packages/blaspsoft/keysmith-vue\"\u003e\u003cimg alt=\"Latest Version\" src=\"https://img.shields.io/packagist/v/blaspsoft/keysmith-vue\"\u003e\u003c/a\u003e\n        \u003ca href=\"https://packagist.org/packages/blaspsoft/keysmith-vue\"\u003e\u003cimg alt=\"License\" src=\"https://img.shields.io/packagist/l/blaspsoft/keysmith-vue\"\u003e\u003c/a\u003e\n    \u003c/p\u003e\n\u003c/p\u003e\n\n# Keysmith Vue - Laravel 12 Vue Starterkit API Token Management\n\nKeysmith Vue is a Laravel 12 Vue Starterkit package that provides Vue.js components for managing API keys and tokens in your application. It offers a clean, user-friendly interface for creating, viewing, and revoking API keys with customizable permissions based on the implementation from Laravel Breeze.\n\n## Features\n\n- 🔑 Easy API token generation and management\n- 🔒 Built on Laravel Sanctum's secure token authentication\n- 🎨 Pre-built Vue components for quick integration\n- 📱 Responsive and user-friendly interface\n- ⚙️ Flexible installation options (page or settings templates)\n- 🛠️ Customizable permissions system\n\n## Requirements\n\n- PHP 8.2 or higher\n- Laravel 12.x\n- Vue 3.x\n- Laravel Sanctum\n\n## Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require blaspsoft/keysmith-vue\n```\n\nChoose your preferred installation template:\n\n### Page Template\n\nInstall this option to add a dedicated API tokens page at `pages/api-tokens/index.vue`. This provides a standalone interface for managing your API tokens.\n\n### Settings Template\n\nChoose this option to integrate API token management within your Laravel Vue Starterkit settings at `pages/settings/APITokens.vue`. This keeps token management alongside your other application settings.\n\nRun one (or both) of the following commands based on your choice:\n\n```bash\nphp artisan keysmith:install page\n```\n\nor\n\n```bash\nphp artisan keysmith:install settings\n```\n\n### Configure Inertia Middleware\n\nAdd the following to your `HandleInertiaRequests.php` middleware's `share` method to handle API token flash messages:\n\n```php\n'flash' =\u003e [\n    'api_token' =\u003e fn () =\u003e session()-\u003eget('api_token'),\n],\n```\n\n```php\npublic function share(Request $request): array\n    {\n        [$message, $author] = str(Inspiring::quotes()-\u003erandom())-\u003eexplode('-');\n\n        return [\n            ...parent::share($request),\n            'name' =\u003e config('app.name'),\n            'quote' =\u003e ['message' =\u003e trim($message), 'author' =\u003e trim($author)],\n            'auth' =\u003e [\n                'user' =\u003e $request-\u003euser(),\n            ],\n            'flash' =\u003e [\n                'api_token' =\u003e fn () =\u003e session()-\u003eget('api_token'),\n            ],\n        ];\n    }\n```\n\nThis configuration is required to display newly created API tokens to users.\n\n### Add navlinks to starterkit templates\n\nDependent of which template you decide to use 'page\" or \"settings\" (or both). You may want to add links to the app sidebar and settings navigations.\n\nFor the page update `js/components/AppSidebar.vue`\n\n```javascript\nconst mainNavItems: NavItem[] = [\n  {\n    title: \"Dashboard\",\n    href: \"/dashboard\",\n    icon: LayoutGrid,\n  },\n  {\n    title: \"API Tokens\",\n    href: \"/api-tokens\",\n    icon: KeyRound,\n  },\n];\n```\n\nFor the settings update `js/layouts/settings/Layout.vue`\n\n```javascript\nconst sidebarNavItems: NavItem[] = [\n  {\n    title: \"Profile\",\n    href: \"/settings/profile\",\n  },\n  {\n    title: \"Password\",\n    href: \"/settings/password\",\n  },\n  {\n    title: \"Appearance\",\n    href: \"/settings/appearance\",\n  },\n  {\n    title: \"API Tokens\",\n    href: \"/settings/api-tokens\",\n  },\n];\n```\n\n### Publish config [optional]\n\n```bash\nphp artisan vendor:publish --tag=keysmith-vue-config --force\n```\n\nThis command will publish a configuration file at `config/keysmith.php`, where you can customize keysmith settings.\n\n## Dependencies\n\nThis package requires Laravel Sanctum for API token authentication. Before using Keysmith Vue, make sure to:\n\n1. Install Laravel Sanctum:\n\n```bash\ncomposer require laravel/sanctum\n```\n\n2. Publish and run Sanctum's migrations:\n\n```bash\nphp artisan vendor:publish --provider=\"Laravel\\Sanctum\\SanctumServiceProvider\" --tag=\"sanctum-migrations\"\nphp artisan migrate\n```\n\n3. Add the HasApiTokens trait to your User model:\n\n```php\nuse Laravel\\Sanctum\\HasApiTokens;\n\nclass User extends Authenticatable\n{\n    use HasApiTokens;\n    // ... existing code ...\n}\n```\n\n## Components\n\nKeysmith Vue provides two components that are installed in your `/components` directory:\n\n- `CreateApiTokenForm.vue`: Form component for generating new API tokens\n- `ManageApiTokens.vue`: Component for viewing and managing existing tokens\n\nThese components are utilized in both the page and settings templates.\n\n## Routes\n\nKeysmith Vue provides two sets of routes depending on your installation choice:\n\n### Page Template Routes\n\nIf you installed using the page template (`keysmith:install page`), these routes are available:\n\n```php\nRoute::get('/api-tokens', [TokenController::class, 'index'])-\u003ename('api-tokens.index');\nRoute::post('/api-tokens', [TokenController::class, 'store'])-\u003ename('api-tokens.store');\nRoute::put('/api-tokens/{token}', [TokenController::class, 'update'])-\u003ename('api-tokens.update');\nRoute::delete('/api-tokens/{token}', [TokenController::class, 'destroy'])-\u003ename('api-tokens.destroy');\n```\n\n### Settings Template Routes\n\nIf you installed using the settings template (`keysmith:install settings`), these routes are available:\n\n```php\nRoute::get('/settings/api-tokens', [TokenController::class, 'index'])-\u003ename('settings.api-tokens.index');\nRoute::post('/settings/api-tokens', [TokenController::class, 'store'])-\u003ename('settings.api-tokens.store');\nRoute::put('/settings/api-tokens/{token}', [TokenController::class, 'update'])-\u003ename('settings.api-tokens.update');\nRoute::delete('/settings/api-tokens/{token}', [TokenController::class, 'destroy'])-\u003ename('settings.api-tokens.destroy');\n```\n\nAll routes are protected by authentication middleware and handle the following operations:\n\n- `GET`: Retrieve all tokens for the authenticated user\n- `POST`: Create a new API token\n- `PUT`: Update token permissions\n- `DELETE`: Revoke an existing token\n\n## Testing\n\nKeysmith Vue includes test files that are placed in your project's `tests/Feature/ApiToken` directory:\n\n- `PageTokenTest.php`: Tests for the page template implementation\n- `SettingsTokenTest.php`: Tests for the settings template implementation\n\nYou can run the tests using:\n\n```bash\nphp artisan test\n```\n\n### Customizing Permissions\n\nYou can customize the available token permissions by modifying the `config/keysmith.php` file:\n\n```php\nreturn [\n    'permissions' =\u003e [\n        'read',\n        'create',\n        'update',\n        'delete',\n        // Add your custom permissions here\n    ],\n];\n```\n\n### Screenshots\n\n\u003cdiv align=\"center\"\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_1.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_2.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_3.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_4.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_5.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_6.png\" /\u003e\n    \u003cimg alt=\"keysmith\" src=\"./assets/screenshots/keysmith_7.png\" /\u003e\n\u003c/div\u003e\n\n### Security\n\nIf you discover any security related issues, please email mike.deeming@blaspsoft.com instead of using the issue tracker.\n\n## Credits\n\n- [Michael Deeming](https://github.com/modla)\n- [All Contributors](../../contributors)\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblaspsoft%2Fkeysmith-vue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblaspsoft%2Fkeysmith-vue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblaspsoft%2Fkeysmith-vue/lists"}