@grafana/ui: Fix login icon (#23732)

* Fix sign in button

* Fix modal button in button

packages/grafana-ui/src/types/icon.ts

@@ -52,6 +52,7 @@ export type IconName =
   | 'circle'
   | 'circle'
   | 'arrow-up'
   | 'arrow-up'
   | 'arrow-from-right'
   | 'arrow-from-right'
+  | 'arrow-from-left'
   | 'keyboard'
   | 'keyboard'
   | 'search'
   | 'search'
   | 'chart-line'
   | 'chart-line'
@@ -162,6 +163,7 @@ export const getAvailableIcons = (): IconName[] => [
   'circle',
   'circle',
   'arrow-up',
   'arrow-up',
   'arrow-from-right',
   'arrow-from-right',
+  'arrow-from-left',
   'keyboard',
   'keyboard',
   'search',
   'search',
   'chart-line',
   'chart-line',

public/app/core/components/sidemenu/SignIn.tsx

@@ -9,7 +9,7 @@ export const SignIn: FC<any> = ({ url }) => {
     <div className="sidemenu-item">
     <div className="sidemenu-item">
       <a href={loginUrl} className="sidemenu-link" target="_self">
       <a href={loginUrl} className="sidemenu-link" target="_self">
         <span className="icon-circle sidemenu-icon">
         <span className="icon-circle sidemenu-icon">
-          <Icon name="sign-in-alt" />
+          <Icon name="arrow-from-left" size="xl" />
         </span>
         </span>
       </a>
       </a>
       <a href={loginUrl} target="_self">
       <a href={loginUrl} target="_self">

public/app/core/components/sidemenu/__snapshots__/SignIn.test.tsx.snap

@@ -13,7 +13,8 @@ exports[`Render should render component 1`] = `
       className="icon-circle sidemenu-icon"
       className="icon-circle sidemenu-icon"
     >
     >
       <Icon
       <Icon
-        name="sign-in-alt"
+        name="arrow-from-left"
+        size="xl"
       />
       />
     </span>
     </span>
   </a>
   </a>

public/app/features/api-keys/ApiKeysPage.tsx

@@ -180,9 +180,7 @@ export class ApiKeysPage extends PureComponent<Props, any> {
     return (
     return (
       <SlideDown in={isAdding}>
       <SlideDown in={isAdding}>
         <div className="cta-form">
         <div className="cta-form">
-          <button className="cta-form__close btn btn-transparent" onClick={this.onToggleAdding}>
-            <IconButton name="times" />
-          </button>
+          <IconButton name="times" className="cta-form__close btn btn-transparent" onClick={this.onToggleAdding} />
           <h5>Add API Key</h5>
           <h5>Add API Key</h5>
           <form className="gf-form-group" onSubmit={this.onAddApiKey}>
           <form className="gf-form-group" onSubmit={this.onAddApiKey}>
             <div className="gf-form-inline">
             <div className="gf-form-inline">

public/app/features/api-keys/__snapshots__/ApiKeysPage.test.tsx.snap

@@ -49,14 +49,11 @@ exports[`Render should render CTA if there are no API keys 1`] = `
       <div
       <div
         className="cta-form"
         className="cta-form"
       >
       >
-        <button
-          className="cta-form__close btn btn-transparent"
-          onClick={[Function]}
-        >
         <IconButton
         <IconButton
+          className="cta-form__close btn btn-transparent"
           name="times"
           name="times"
+          onClick={[Function]}
         />
         />
-        </button>
         <h5>
         <h5>
           Add API Key
           Add API Key
         </h5>
         </h5>