Fixes #38108 - As a user I want to invalidate tokens for self(UI)

app/views/jwt_tokens/_jwt_tokens_tab.html.erb

@@ -0,0 +1,5 @@
+<div class="tab-pane" id="jwt_tokens">
+  <%= react_component('JwtTokens', {
+    userId: @user.id,
+  }) %>
+</div>

app/views/users/_form.html.erb

@@ -18,6 +18,9 @@
     <% if @editing_self || (@user.persisted? && authorized_for(hash_for_api_user_personal_access_tokens_path(user_id: @user))) %>
       <li><a href='#personal_access_tokens' data-toggle='tab'><%= _('Personal Access Tokens') %></a></li>
     <% end %>
+    <% if @editing_self %>
+      <li><a href='#jwt_tokens' data-toggle='tab'><%= _('JWT Tokens') %></a></li>
+    <% end %>
     <%= render_tab_header_for(:main_tabs, :subject => @user, :form => f) %>
   </ul>
 
@@ -97,6 +100,10 @@
       <%= render 'personal_access_tokens/personal_access_tokens_tab', :f => f, :user => @user %>
     <% end %>
 
+    <% if @editing_self %>
+      <%= render 'jwt_tokens/jwt_tokens_tab', :f => f, :user => @user %>
+    <% end %>
+
     <div class='tab-pane' id='roles'>
       <% caption = @user.inherited_admin? ? _('Admin rights are currently inherited from a user group') : '' %>
       <%= checkbox_f f, :admin, help_block: caption if User.current.can_change_admin_flag? %>

test/controllers/users_controller_test.rb

@@ -167,6 +167,15 @@ class UsersControllerTest < ActionController::TestCase
     assert_nil user.jwt_secret
   end
 
+  test "User should be able to invalidate jwt for self" do
+    User.current = users(:one)
+    user = User.current
+    FactoryBot.build(:jwt_secret, token: 'test_jwt_secret', user: user)
+    patch :invalidate_jwt, params: { :id => user.id }
+    user.reload
+    assert_nil user.jwt_secret
+  end
+
   test 'user with edit users permission should be able to invalidate jwt for another user' do
     User.current = setup_user "edit", "users"
     user = users(:two)

webpack/assets/javascripts/react_app/components/componentRegistry.js

@@ -44,6 +44,7 @@ import LabelIcon from './common/LabelIcon';
 import { WelcomeAuthSource } from './AuthSource/Welcome';
 import { WelcomeConfigReports } from './ConfigReports/Welcome';
 import { WelcomeArchitecture } from './Architectures/Welcome';
+import JwtTokens from './users/JwtTokens/JwtTokens';
 
 const componentRegistry = {
   registry: forceSingleton('component_registry', () => ({})),
@@ -142,6 +143,7 @@ const coreComponents = [
   { name: 'SettingsTable', type: SettingsTable },
   { name: 'SettingUpdateModal', type: SettingUpdateModal },
   { name: 'PersonalAccessTokens', type: PersonalAccessTokens },
+  { name: 'JwtTokens', type: JwtTokens },
   { name: 'ClipboardCopy', type: ClipboardCopy },
   { name: 'LabelIcon', type: LabelIcon },
   {

webpack/assets/javascripts/react_app/components/users/JwtTokens/JwtTokens.js

@@ -0,0 +1,61 @@
+import React, { Fragment } from 'react';
+import { Button } from '@patternfly/react-core';
+import { KeyIcon } from '@patternfly/react-icons';
+import { useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+import { useAPI } from '../../../common/hooks/API/APIHooks';
+import { openConfirmModal } from '../../ConfirmModal';
+import { APIActions } from '../../../redux/API';
+import { translate as __ } from '../../../common/I18n';
+
+const JwtTokens = ({ userId }) => {
+  const dispatch = useDispatch();
+  return (
+    <Fragment>
+      <table className="table table-bordered table-striped table-hover table-fixed">
+        <tbody>
+          <tr>
+            <td className="blank-slate-pf">
+              <div className="blank-slate-pf-icon">
+                <KeyIcon type="fa" name="key" color="#9c9c9c" />
+              </div>
+              <h1>{__('JWT Tokens')}</h1>
+              <p>
+                {__(
+                  'By invalidating your JSON Web Tokens (JWTs), you will no longer be able to register hosts by using your existing JWTs.'
+                )}
+              </p>
+              <Button
+                ouiaId="invalidate-jwt-token-button"
+                variant="primary"
+                isSmall
+                onClick={() =>
+                  dispatch(
+                    openConfirmModal({
+                      isWarning: true,
+                      title: __('Invalidate tokens for self?'),
+                      confirmButtonText: __('Confirm'),
+                      onConfirm: () =>
+                        useAPI('patch', `/users/${userId}/invalidate_jwt`, {
+                          successToast: () =>
+                            __('Successfully Invalidated JWTs'),
+                        }),
+                    })
+                  )
+                }
+              >
+                {__('Invalidate JWTs')}
+              </Button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </Fragment>
+  );
+};
+
+JwtTokens.propTypes = {
+  userId: PropTypes.string.isRequired,
+};
+
+export default JwtTokens;