{"id":16526694,"url":"https://github.com/rtippin/messenger-ui","last_synced_at":"2025-03-21T09:31:09.212Z","repository":{"id":47064777,"uuid":"379743201","full_name":"RTippin/messenger-ui","owner":"RTippin","description":"Ready-made UI and web routes for core rtippin/messenger.","archived":false,"fork":false,"pushed_at":"2023-07-06T01:03:27.000Z","size":4015,"stargazers_count":14,"open_issues_count":0,"forks_count":14,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-10-12T17:29:22.112Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/RTippin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":"RTippin"}},"created_at":"2021-06-23T22:25:55.000Z","updated_at":"2024-07-31T15:20:01.000Z","dependencies_parsed_at":"2023-01-23T15:01:17.112Z","dependency_job_id":null,"html_url":"https://github.com/RTippin/messenger-ui","commit_stats":null,"previous_names":[],"tags_count":34,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RTippin%2Fmessenger-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RTippin%2Fmessenger-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RTippin%2Fmessenger-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RTippin%2Fmessenger-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/RTippin","download_url":"https://codeload.github.com/RTippin/messenger-ui/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221813509,"owners_count":16884840,"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":[],"created_at":"2024-10-11T17:29:35.201Z","updated_at":"2024-10-28T09:43:36.964Z","avatar_url":"https://github.com/RTippin.png","language":"JavaScript","funding_links":["https://github.com/sponsors/RTippin"],"categories":[],"sub_categories":[],"readme":"# Messenger UI\n\n[![Latest Version on Packagist][ico-version]][link-packagist]\n[![Total Downloads][ico-downloads]][link-downloads]\n[![StyleCI][ico-styleci]][link-styleci]\n[![License][ico-license]][link-license]\n\n---\n\n![Preview](https://raw.githubusercontent.com/RTippin/messenger/1.x/docs/images/image1.png?raw=true)\n\n---\n\n## Ready-made UI and web routes for use with [rtippin/messenger][link-messenger]\n\n### Notes\n- This package provides web routes and a published UI to consume `messenger's` API. No authentication routes/system will be setup for you.\n- Our compiled `NotifyManager.js` uses laravel echo, with the `pusher-js` library. \n- For websockets, this package supports [pusher.com][link-pusher] directly, or the drop-in replacement [laravel-websockets][link-laravel-websockets].\n  - Instructions are located below for setting up the websocket implementation of your choosing.\n- After publishing our `views`, you may wish to edit them to fit your needs.\n- Future versions planned will be crafted in `react`.\n\n---\n\n# Installation\n\n### Via Composer\n\n``` bash\ncomposer require rtippin/messenger-ui\n```\n\n### Publish Assets and Config\n- This will publish our JS assets, images, views, and config.\n```bash\nphp artisan messenger:ui:publish\n```\n- When using composer to update this package, we recommend republishing our JS/CSS assets:\n```bash\nphp artisan vendor:publish --tag=messenger-ui.assets --force\n```\n\n---\n\n# Config\n\n***Default:***\n\n```php\n'site_name' =\u003e env('MESSENGER_SITE_NAME', 'Messenger'),\n\n'websocket' =\u003e [\n    'pusher' =\u003e env('MESSENGER_SOCKET_PUSHER', false),\n    'host' =\u003e env('MESSENGER_SOCKET_HOST', 'localhost'),\n    'auth_endpoint' =\u003e env('MESSENGER_SOCKET_AUTH_ENDPOINT', '/api/broadcasting/auth'),\n    'key' =\u003e env('MESSENGER_SOCKET_KEY'),\n    'port' =\u003e env('MESSENGER_SOCKET_PORT', 6001),\n    'use_tsl' =\u003e env('MESSENGER_SOCKET_TLS', false),\n    'cluster' =\u003e env('MESSENGER_SOCKET_CLUSTER'),\n],\n\n'routing' =\u003e [\n    'domain' =\u003e null,\n    'prefix' =\u003e 'messenger',\n    'middleware' =\u003e ['web', 'auth', 'messenger.provider'],\n    'invite_middleware' =\u003e ['web', 'messenger.provider'],\n],\n```\n- `site_name` is used in our views to inject the name in the navbar.\n- `websocket`:\n  - When using the real `pusher.com`, you need to set `pusher` to `true`, add in your `cluster`, and your `key`.\n  - When using `laravel-websockets`, you leave `pusher` to `false`, ignore `cluster`, and set your `host`, `port`, and `key`.\n  - The `auth_endpoint` is for your laravel's backend to authorize access to our messenger channels. The default `messenger.php` config prefixes the channel routes with `api`, hence our default config above uses `/api/broadcasting/auth` when not set.\n- `routing` you may choose your desired endpoint domain, prefix and middleware.\n  - Invite join web route you can define separate middleware from the rest of the web routes, as you may want a guest allowed to view that page.\n  - The default `messenger.provider` middleware is included with `messenger` and simply sets the active messenger provider by grabbing the authenticated user from `$request-\u003euser()`.\n\n---\n\n# Using [Pusher][link-pusher]\n- After you have your pusher credentials ready, you should install the pusher SDK:\n\n```bash\ncomposer require pusher/pusher-php-server\n```\n\n- Once installed, set your `.env` variables:\n\n***Default `broadcasting.php` config***\n\n```php\n'pusher' =\u003e [\n    'driver' =\u003e 'pusher',\n    'key' =\u003e env('PUSHER_APP_KEY'),\n    'secret' =\u003e env('PUSHER_APP_SECRET'),\n    'app_id' =\u003e env('PUSHER_APP_ID'),\n    'options' =\u003e [\n        'cluster' =\u003e env('PUSHER_APP_CLUSTER'),\n        'useTLS' =\u003e false,\n    ],\n], \n```\n***`.env` keys for both pusher and our UI***\n\n```dotenv\nBROADCAST_DRIVER=pusher\nPUSHER_APP_ID=YourPusherId\nPUSHER_APP_KEY=YourPusherKey\nPUSHER_APP_SECRET=YourPusherSecret\nPUSHER_APP_CLUSTER=YourPusherCluster\nMESSENGER_SOCKET_PUSHER=true\nMESSENGER_SOCKET_KEY=\"${PUSHER_APP_KEY}\"\nMESSENGER_SOCKET_CLUSTER=\"${PUSHER_APP_CLUSTER}\"\n```\n- You are all set! Our UI will connect to your pusher account. Be sure to enable `client events` within your pusher account if you want our client to client events enabled.\n\n---\n\n# Using [laravel-websockets][link-laravel-websockets]\n- First, you need to have installed the websocket package (This package has been tested using laravel-websockets v1.12).\n- Ideally, you should follow the official [Installation Documentation][link-laravel-websockets-install] from `beyondcode` if you are doing a fresh installation.\n\n```bash\ncomposer require beyondcode/laravel-websockets \"^1.12\"\n```\n\n- Once you have installed and configured the websocket package, set your `.env` variables and update the default pusher config:\n\n***Updated `broadcasting.php` config per `beyondcode's` documentation***\n\n```php\n'pusher' =\u003e [\n    'driver' =\u003e 'pusher',\n    'key' =\u003e env('PUSHER_APP_KEY'),\n    'secret' =\u003e env('PUSHER_APP_SECRET'),\n    'app_id' =\u003e env('PUSHER_APP_ID'),\n    'options' =\u003e [\n        'cluster' =\u003e env('PUSHER_APP_CLUSTER'),\n        'encrypted' =\u003e true,\n        'host' =\u003e 'localhost',\n        'port' =\u003e 6001,\n        'scheme' =\u003e 'http'\n    ],\n],\n```\n***`.env` keys for both `laravel-websockets` and our UI***\n\n```dotenv\nBROADCAST_DRIVER=pusher\nPUSHER_APP_ID=MakeYourID\nPUSHER_APP_KEY=MakeYourKey\nPUSHER_APP_SECRET=MakeYourSecret\nMESSENGER_SOCKET_HOST=localhost\nMESSENGER_SOCKET_KEY=\"${PUSHER_APP_KEY}\"\n```\n- You are all set! Our UI will connect to your server running `php artisan websockets:serve`. Be sure to enable `client events` in your `laravel-websockets` config if you want our client to client events enabled.\n\n\n[link-messenger]: https://github.com/RTippin/messenger\n[link-author]: https://github.com/rtippin\n[ico-version]: https://img.shields.io/packagist/v/rtippin/messenger-ui.svg?style=plastic\u0026cacheSeconds=3600\n[ico-downloads]: https://img.shields.io/packagist/dt/rtippin/messenger-ui.svg?style=plastic\u0026cacheSeconds=3600\n[ico-styleci]: https://styleci.io/repos/379743201/shield?style=plastic\u0026cacheSeconds=3600\n[ico-license]: https://img.shields.io/github/license/RTippin/messenger-ui?style=plastic\n[link-packagist]: https://packagist.org/packages/rtippin/messenger-ui\n[link-downloads]: https://packagist.org/packages/rtippin/messenger-ui\n[link-license]: https://packagist.org/packages/rtippin/messenger-ui\n[link-styleci]: https://styleci.io/repos/379743201\n[link-laravel-websockets]: https://beyondco.de/docs/laravel-websockets/getting-started/introduction\n[link-laravel-websockets-install]: https://beyondco.de/docs/laravel-websockets/getting-started/installation\n[link-pusher]: https://pusher.com/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frtippin%2Fmessenger-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frtippin%2Fmessenger-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frtippin%2Fmessenger-ui/lists"}