From 6efcba17096377fa86e173ee254d8537d3b41c39 Mon Sep 17 00:00:00 2001 From: Jialei <3217223+jialeicui@users.noreply.github.com> Date: Mon, 19 Sep 2022 16:52:49 +0800 Subject: [PATCH] enhance(console): support getting token for swcli login (#1238) --- console/src/assets/fonts/iconfont.css | 10 ++++-- console/src/assets/fonts/iconfont.js | 2 +- console/src/assets/fonts/iconfont.json | 7 +++++ console/src/assets/fonts/iconfont.ttf | 4 +-- console/src/assets/fonts/iconfont.woff | 4 +-- console/src/assets/fonts/iconfont.woff2 | 4 +-- console/src/components/Header/index.tsx | 37 +++++++++++++++++++++-- console/src/components/IconFont/index.tsx | 1 + console/src/i18n/locales.ts | 3 ++ 9 files changed, 60 insertions(+), 12 deletions(-) diff --git a/console/src/assets/fonts/iconfont.css b/console/src/assets/fonts/iconfont.css index a27f038663..f8ad3c987d 100644 --- a/console/src/assets/fonts/iconfont.css +++ b/console/src/assets/fonts/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: "iconfont"; /* Project id 3410006 */ - src: url('iconfont.woff2?t=1662710521991') format('woff2'), - url('iconfont.woff?t=1662710521991') format('woff'), - url('iconfont.ttf?t=1662710521991') format('truetype'); + src: url('iconfont.woff2?t=1663575449431') format('woff2'), + url('iconfont.woff?t=1663575449431') format('woff'), + url('iconfont.ttf?t=1663575449431') format('truetype'); } .iconfont { @@ -13,6 +13,10 @@ -moz-osx-font-smoothing: grayscale; } +.icon-token:before { + content: "\e64d"; +} + .icon-pause:before { content: "\e61e"; } diff --git a/console/src/assets/fonts/iconfont.js b/console/src/assets/fonts/iconfont.js index f105fa45b4..9848f3efb5 100644 --- a/console/src/assets/fonts/iconfont.js +++ b/console/src/assets/fonts/iconfont.js @@ -1 +1 @@ -window._iconfont_svg_string_3410006='',function(o){var l=(l=document.getElementsByTagName("script"))[l.length-1],c=l.getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var i,h,v,t,m,s=function(l,c){c.parentNode.insertBefore(l,c)};if(c&&!o.__iconfont__svg__cssinject__){o.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(l){console&&console.log(l)}}i=function(){var l,c=document.createElement("div");c.innerHTML=o._iconfont_svg_string_3410006,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(l=document.body).firstChild?s(c,l.firstChild):l.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(i,0):(h=function(){document.removeEventListener("DOMContentLoaded",h,!1),i()},document.addEventListener("DOMContentLoaded",h,!1)):document.attachEvent&&(v=i,t=o.document,m=!1,e(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,a())})}function a(){m||(m=!0,v())}function e(){try{t.documentElement.doScroll("left")}catch(l){return void setTimeout(e,50)}a()}}(window); \ No newline at end of file +window._iconfont_svg_string_3410006='',function(o){var l=(l=document.getElementsByTagName("script"))[l.length-1],c=l.getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var i,h,v,t,m,s=function(l,c){c.parentNode.insertBefore(l,c)};if(c&&!o.__iconfont__svg__cssinject__){o.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(l){console&&console.log(l)}}i=function(){var l,c=document.createElement("div");c.innerHTML=o._iconfont_svg_string_3410006,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(l=document.body).firstChild?s(c,l.firstChild):l.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(i,0):(h=function(){document.removeEventListener("DOMContentLoaded",h,!1),i()},document.addEventListener("DOMContentLoaded",h,!1)):document.attachEvent&&(v=i,t=o.document,m=!1,e(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,a())})}function a(){m||(m=!0,v())}function e(){try{t.documentElement.doScroll("left")}catch(l){return void setTimeout(e,50)}a()}}(window); \ No newline at end of file diff --git a/console/src/assets/fonts/iconfont.json b/console/src/assets/fonts/iconfont.json index 313db5170e..0b95a67681 100644 --- a/console/src/assets/fonts/iconfont.json +++ b/console/src/assets/fonts/iconfont.json @@ -5,6 +5,13 @@ "css_prefix_text": "icon-", "description": "", "glyphs": [ + { + "icon_id": "31904242", + "name": "token", + "font_class": "token", + "unicode": "e64d", + "unicode_decimal": 58957 + }, { "icon_id": "31315261", "name": "pause", diff --git a/console/src/assets/fonts/iconfont.ttf b/console/src/assets/fonts/iconfont.ttf index 76c0b466ca..3bf53d20ae 100644 --- a/console/src/assets/fonts/iconfont.ttf +++ b/console/src/assets/fonts/iconfont.ttf @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:fc9db0ec077595c49f63099abea617116808af663f44f2ec289d9cd3c6251fe5 -size 14288 +oid sha256:4161a9c94cdd624463ae229e633b03527a5f45c27ff3d25af1deb72dcf215a28 +size 14520 diff --git a/console/src/assets/fonts/iconfont.woff b/console/src/assets/fonts/iconfont.woff index 5fbef711f8..60503a66de 100644 --- a/console/src/assets/fonts/iconfont.woff +++ b/console/src/assets/fonts/iconfont.woff @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:4e1404ae428a503b12a48a323e6ba16c663f818eeaaa69bdefa2c7abe1ede769 -size 8432 +oid sha256:910a49efa68736adfccc10a9941a52ee0fe1121eb0fc9b3712f443475867a75b +size 8584 diff --git a/console/src/assets/fonts/iconfont.woff2 b/console/src/assets/fonts/iconfont.woff2 index 904af1cc3b..08ad378031 100644 --- a/console/src/assets/fonts/iconfont.woff2 +++ b/console/src/assets/fonts/iconfont.woff2 @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:296d28b47af7bd390f4b7134f0097e44b2892a1df6b647bf34713cc7a8850fe9 -size 7088 +oid sha256:ee823b2095cabf23f59fecc22644b1ab8286b78a85382c00e02f6e7aa3d65e3a +size 7232 diff --git a/console/src/components/Header/index.tsx b/console/src/components/Header/index.tsx index 7f9ea8f096..05e2c94cfc 100644 --- a/console/src/components/Header/index.tsx +++ b/console/src/components/Header/index.tsx @@ -4,6 +4,7 @@ import { Modal, ModalHeader, ModalBody } from 'baseui/modal' import { useStyletron } from 'baseui' import { headerHeight } from '@/consts' import useTranslation from '@/hooks/useTranslation' +import { useSearchParam } from 'react-use' import { createUseStyles } from 'react-jss' import { IThemedStyleProps } from '@/theme' import { useCurrentThemeType } from '@/hooks/useCurrentThemeType' @@ -17,6 +18,9 @@ import { useCurrentUserRoles } from '@/hooks/useCurrentUserRoles' import { TextLink } from '@/components/Link' import classNames from 'classnames' import { useAuth } from '@/api/Auth' +import CopyToClipboard from 'react-copy-to-clipboard' +import Button from '@/components/Button' +import Input from '@/components/Input' import IconFont from '../IconFont' import Logo from './Logo' import Avatar from '../Avatar' @@ -247,7 +251,7 @@ const useStyles = createUseStyles({ }) export default function Header() { - const [, theme] = useStyletron() + const [css, theme] = useStyletron() const themeType = useCurrentThemeType() const styles = useStyles({ theme, themeType }) const headerStyles = useHeaderStyles({ theme }) @@ -257,12 +261,14 @@ export default function Header() { // eslint-disable-next-line react-hooks/exhaustive-deps const [currentUserRole] = useCurrentUserRoles() const [sysRole, setSysRole] = useState('GUEST') + const title = !!useSearchParam('token') const [t] = useTranslation() const history = useHistory() - const { onLogout } = useAuth() + const { token, onLogout } = useAuth() const [isChangePasswordOpen, setIsChangePasswordOpen] = useState(false) + const [isShowTokenOpen, setIsShowTokenOpen] = useState(title) const handleChangePassword = useCallback( async (data: IChangePasswordSchema) => { await changePassword(data) @@ -340,6 +346,17 @@ export default function Header() { {t('Change Password')} +
{ + setIsShowTokenOpen(true) + }} + > + + {t('Get Token')} +
@@ -364,6 +381,22 @@ export default function Header() { + setIsShowTokenOpen(false)} isOpen={isShowTokenOpen}> + {t('Get Token')} + +
+ + { + toaster.positive(t('Copied'), { autoHideDuration: 1000 }) + }} + > + + +
+ + ) } diff --git a/console/src/components/IconFont/index.tsx b/console/src/components/IconFont/index.tsx index 28622f824e..075a095a9a 100644 --- a/console/src/components/IconFont/index.tsx +++ b/console/src/components/IconFont/index.tsx @@ -63,6 +63,7 @@ const iconTypes = [ 'view', 'grid', 'fullscreen', + 'token', ] interface IIconFontProps { diff --git a/console/src/i18n/locales.ts b/console/src/i18n/locales.ts index 6a18085e92..b3346d0f92 100644 --- a/console/src/i18n/locales.ts +++ b/console/src/i18n/locales.ts @@ -345,6 +345,9 @@ const locales0 = { 'Change Password': { en: 'Change Password', }, + 'Get Token': { + en: 'Get Token', + }, 'Password Not Equal': { en: 'The passwords you entered do not match', },