diff --git a/app/controllers/twitter/callbacks_controller.rb b/app/controllers/twitter/callbacks_controller.rb index a46c54821..fe55ba3a1 100644 --- a/app/controllers/twitter/callbacks_controller.rb +++ b/app/controllers/twitter/callbacks_controller.rb @@ -1,6 +1,6 @@ class Twitter::CallbacksController < Twitter::BaseController def show - return redirect_to app_new_twitter_inbox_url if permitted_params[:denied] + return redirect_to twitter_app_redirect_url if permitted_params[:denied] @response = twitter_client.access_token( oauth_token: permitted_params[:oauth_token], @@ -10,9 +10,9 @@ class Twitter::CallbacksController < Twitter::BaseController inbox = build_inbox ::Redis::Alfred.delete(permitted_params[:oauth_token]) ::Twitter::WebhookSubscribeService.new(inbox_id: inbox.id).perform - redirect_to app_twitter_inbox_agents_url(inbox_id: inbox.id) + redirect_to app_twitter_inbox_agents_url(account_id: account.id, inbox_id: inbox.id) else - redirect_to app_new_twitter_inbox_url + redirect_to twitter_app_redirect_url end end @@ -30,6 +30,10 @@ class Twitter::CallbacksController < Twitter::BaseController @account ||= Account.find_by!(id: account_id) end + def twitter_app_redirect_url + app_new_twitter_inbox_url(account_id: account.id) + end + def build_inbox ActiveRecord::Base.transaction do twitter_profile = account.twitter_profiles.create( diff --git a/app/javascript/dashboard/i18n/locale/en/login.json b/app/javascript/dashboard/i18n/locale/en/login.json index 9e881e012..a6be25967 100644 --- a/app/javascript/dashboard/i18n/locale/en/login.json +++ b/app/javascript/dashboard/i18n/locale/en/login.json @@ -10,7 +10,7 @@ "PLACEHOLDER": "Password" }, "API": { - "SUCCESS_MESSAGE": "Login Successfull", + "SUCCESS_MESSAGE": "Login Successful", "ERROR_MESSAGE": "Could not connect to Woot Server, Please try again later", "UNAUTH": "Username / Password Incorrect. Please try again" }, @@ -18,4 +18,4 @@ "CREATE_NEW_ACCOUNT": "Create new account", "SUBMIT": "Sign In" } -} \ No newline at end of file +} diff --git a/app/services/twitter/webhook_subscribe_service.rb b/app/services/twitter/webhook_subscribe_service.rb index 11e7af86f..0c2badaff 100644 --- a/app/services/twitter/webhook_subscribe_service.rb +++ b/app/services/twitter/webhook_subscribe_service.rb @@ -4,7 +4,7 @@ class Twitter::WebhookSubscribeService pattr_initialize [:inbox_id] def perform - register_response = twitter_client.register_webhook(url: webhooks_twitter_url) + register_response = twitter_client.register_webhook(url: webhooks_twitter_url(protocol: 'https')) twitter_client.subscribe_webhook if register_response.status == '200' Rails.logger.info 'TWITTER_REGISTER_WEBHOOK_FAILURE: ' + register_response.body.to_s end diff --git a/config/environments/development.rb b/config/environments/development.rb index a9b30a68f..a0587df37 100644 --- a/config/environments/development.rb +++ b/config/environments/development.rb @@ -32,11 +32,8 @@ Rails.application.configure do # Store uploaded files on the local file system (see config/storage.yml for options). config.active_storage.service = :local - # Don't care if the mailer can't send. config.active_job.queue_adapter = :sidekiq - config.action_mailer.raise_delivery_errors = false - config.action_mailer.perform_caching = false config.action_mailer.default_url_options = { host: 'localhost', port: 3000 } diff --git a/config/routes.rb b/config/routes.rb index 78a543003..cf0d9a84c 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -12,8 +12,8 @@ Rails.application.routes.draw do get '/app', to: 'dashboard#index' get '/app/*params', to: 'dashboard#index' - get '/app/settings/inboxes/new/twitter', to: 'dashboard#index', as: 'app_new_twitter_inbox' - get '/app/settings/inboxes/new/:inbox_id/agents', to: 'dashboard#index', as: 'app_twitter_inbox_agents' + get '/app/accounts/:account_id/settings/inboxes/new/twitter', to: 'dashboard#index', as: 'app_new_twitter_inbox' + get '/app/accounts/:account_id/settings/inboxes/new/:inbox_id/agents', to: 'dashboard#index', as: 'app_twitter_inbox_agents' resource :widget, only: [:show] @@ -113,8 +113,8 @@ Rails.application.routes.draw do end end end - - namespace :v2 do + + namespace :v2 do resources :accounts, only: [], module: :accounts do resources :reports, only: [] do collection do diff --git a/docs/channels/images/twitter/add_agents.png b/docs/channels/images/twitter/add_agents.png new file mode 100644 index 000000000..49523946e Binary files /dev/null and b/docs/channels/images/twitter/add_agents.png differ diff --git a/docs/channels/images/twitter/authorize_twitter.png b/docs/channels/images/twitter/authorize_twitter.png new file mode 100644 index 000000000..70ee67f6e Binary files /dev/null and b/docs/channels/images/twitter/authorize_twitter.png differ diff --git a/docs/channels/images/twitter/finish_inbox.png b/docs/channels/images/twitter/finish_inbox.png new file mode 100644 index 000000000..cc40da4f2 Binary files /dev/null and b/docs/channels/images/twitter/finish_inbox.png differ diff --git a/docs/channels/images/twitter/inbox_create.png b/docs/channels/images/twitter/inbox_create.png new file mode 100644 index 000000000..11b78a637 Binary files /dev/null and b/docs/channels/images/twitter/inbox_create.png differ diff --git a/docs/channels/images/twitter/inbox_settings.png b/docs/channels/images/twitter/inbox_settings.png new file mode 100644 index 000000000..a8a15cae4 Binary files /dev/null and b/docs/channels/images/twitter/inbox_settings.png differ diff --git a/docs/channels/images/twitter/list_of_channels.png b/docs/channels/images/twitter/list_of_channels.png new file mode 100644 index 000000000..3768848a1 Binary files /dev/null and b/docs/channels/images/twitter/list_of_channels.png differ diff --git a/docs/channels/images/twitter/sign_in_with_twitter.png b/docs/channels/images/twitter/sign_in_with_twitter.png new file mode 100644 index 000000000..3a6c0a016 Binary files /dev/null and b/docs/channels/images/twitter/sign_in_with_twitter.png differ diff --git a/docs/channels/twitter-channel.md b/docs/channels/twitter-channel.md new file mode 100644 index 000000000..4d7726204 --- /dev/null +++ b/docs/channels/twitter-channel.md @@ -0,0 +1,32 @@ +--- +path: "/docs/channels/twitter" +title: "How to create Twitter channel?" +--- + +**Step 1**. Click on "Add Inbox" button from Settings > Inboxes page. + +![inbox_create](./images/twitter/inbox_create.png) + +**Step 2**. Click on "Twitter" icon. + +![list_of_channels](./images/twitter/list_of_channels.png) + +**Step 3**. Click on "Sign in with Twitter" button + +![sign_in_with_twitter](./images/twitter/sign_in_with_twitter.png) + +**Step 4**. You will be redirected to Twitter, Click on "Authorize app" button. + +![authorize_twitter](./images/twitter/authorize_twitter.png) + +**Step 5**. "Add agents" to your website inbox. + +![add_agents](./images/add_agents.png) + +**Step 6**. Hooray! You have sucessfully created a Twitter inbox. You will be able to manage Twitter DMs and tweets mentioning you in the Chatwoot Inbox. + +![finish_inbox](./images/twitter/finish_inbox.png) + + **Step 7**. If you want to update the agents who have access to the inbox, you can go to Settings > Inboxes. + +![inbox_settings](./images/twitter/inbox_settings.png) diff --git a/docs/development/project-setup/images/twitter/apply_to_twitter.png b/docs/development/project-setup/images/twitter/apply_to_twitter.png new file mode 100644 index 000000000..462976907 Binary files /dev/null and b/docs/development/project-setup/images/twitter/apply_to_twitter.png differ diff --git a/docs/development/project-setup/images/twitter/apps.png b/docs/development/project-setup/images/twitter/apps.png new file mode 100644 index 000000000..a18ae7fa5 Binary files /dev/null and b/docs/development/project-setup/images/twitter/apps.png differ diff --git a/docs/development/project-setup/images/twitter/dev_environment.png b/docs/development/project-setup/images/twitter/dev_environment.png new file mode 100644 index 000000000..56275e35b Binary files /dev/null and b/docs/development/project-setup/images/twitter/dev_environment.png differ diff --git a/docs/development/project-setup/images/twitter/keys_and_tokens.png b/docs/development/project-setup/images/twitter/keys_and_tokens.png new file mode 100644 index 000000000..9d4975306 Binary files /dev/null and b/docs/development/project-setup/images/twitter/keys_and_tokens.png differ diff --git a/docs/development/project-setup/images/twitter/setup_dev_environment.png b/docs/development/project-setup/images/twitter/setup_dev_environment.png new file mode 100644 index 000000000..df4e464e0 Binary files /dev/null and b/docs/development/project-setup/images/twitter/setup_dev_environment.png differ diff --git a/docs/development/project-setup/twitter-setup.md b/docs/development/project-setup/twitter-setup.md new file mode 100644 index 000000000..8117c4628 --- /dev/null +++ b/docs/development/project-setup/twitter-setup.md @@ -0,0 +1,56 @@ +--- +path: "/docs/twitter-app-setup" +title: "Twitter App Setup" +--- + +Twitter channel with Chatwoot requires access to Twitter APIs. We are using Account Activity API. If you don't have an access to Twitter Business APIs, apply for one at [Twitter developer portal](https://developer.twitter.com/en/apply-for-access). + +![apply_to_twitter](./images/twitter/apply_to_twitter.png) + +Once your application is approved, you will be able to add Twitter Apps and dev environments. If you have applied for a team account, you will able to invite more team members. Inorder for the channel to work you will have to set the following environment variables. We will be describing what it means in the following sections. + +```bash +TWITTER_APP_ID= +TWITTER_CONSUMER_KEY= +TWITTER_CONSUMER_SECRET= +TWITTER_ENVIRONMENT= +``` + +### Create a Twitter App + +URL: https://developer.twitter.com/en/apps/create + +Create a Twitter by filling all the required fields in the above link. + +#### Things to note: + +1. Enable Sign in with Twitter +2. Configure the callback url as `{your_chatwoot_installation_url}/twitter/callback` + +After you create the app, you will be able to see a tab `Keys and Tokens`. + +Use `API key` under `Consumer API keys` as `TWITTER_CONSUMER_KEY` in Chatwoot. + +Use `API secret key` under `Consumer API keys` as `TWITTER_CONSUMER_SECRET` in Chatwoot. + +![keys_and_tokens](./images/twitter/keys_and_tokens.png) + +Go to your apps, you will able to see your app id. Use this app id as `TWITTER_APP_ID` in Chatwoot. + +![apps](./images/twitter/apps.png) + +### Create a dev environment + +Inorder for the DMs and Tweets to work in realtime, you need to set up Account Activity API dev environment as follows. + +URL: https://developer.twitter.com/en/account/environments + +![dev_environment](./images/twitter/dev_environment.png) + +Click on `Set up dev environment`. You will be able to see a form as follows. + +Provide a `Dev Environment Label`, this should be an alphanumeric string. Use the same string as `TWITTER_ENVIRONMENT` in Chatwoot. + +![setup_dev_environment](./images/twitter/setup_dev_environment.png) + +Once you do this, you will ready to use Twitter Channels. To connect your Twitter Account, follow this [guide](/docs/channels/twitter). diff --git a/spec/controllers/twitter/callbacks_controller_spec.rb b/spec/controllers/twitter/callbacks_controller_spec.rb index 425caa2de..430068b83 100644 --- a/spec/controllers/twitter/callbacks_controller_spec.rb +++ b/spec/controllers/twitter/callbacks_controller_spec.rb @@ -24,7 +24,7 @@ RSpec.describe 'Twitter::CallbacksController', type: :request do it 'renders the page correctly when called with website_token' do get twitter_callback_url account.reload - expect(response).to redirect_to app_twitter_inbox_agents_url(inbox_id: account.inboxes.last.id) + expect(response).to redirect_to app_twitter_inbox_agents_url(account_id: account.id, inbox_id: account.inboxes.last.id) expect(account.inboxes.count).to be 1 expect(account.twitter_profiles.last.inbox.name).to eq 'chatwoot' expect(account.twitter_profiles.last.profile_id).to eq '100'