feat: add Icons plugin

* Change existing icons to React wrapper components

* Add `icons` plugin to expose Icon components to plugin system

* Create components that re-export Lock and Unlock components so they can be changed separately in Authorise top button and Authorise operation summary button

* Add new Lock and Unlock icons to `auth` plugin

---------

Co-authored-by: Vladimír Gorej <vladimir.gorej@smartbear.com>
This commit is contained in:
Damian Polewski
2023-07-20 14:51:17 +02:00
committed by GitHub
parent be9f94490b
commit f3ea2a251d
24 changed files with 386 additions and 36 deletions

View File

@@ -14,14 +14,14 @@ export default class AuthorizeBtn extends React.Component {
//must be moved out of button component
const AuthorizationPopup = getComponent("authorizationPopup", true)
const LockAuthIcon = getComponent("LockAuthIcon", true)
const UnlockAuthIcon = getComponent("UnlockAuthIcon", true)
return (
<div className="auth-wrapper">
<button className={isAuthorized ? "btn authorize locked" : "btn authorize unlocked"} onClick={onClick}>
<span>Authorize</span>
<svg width="20" height="20">
<use href={ isAuthorized ? "#locked" : "#unlocked" } xlinkHref={ isAuthorized ? "#locked" : "#unlocked" } />
</svg>
{isAuthorized ? <LockAuthIcon /> : <UnlockAuthIcon />}
</button>
{ showPopup && <AuthorizationPopup /> }
</div>