separated access tokens from link for app usage

This commit is contained in:
Roland Osborne 2022-09-10 21:53:19 -07:00
parent a2d20d04de
commit 3516c917a2
4 changed files with 46 additions and 4 deletions

View File

@ -122,15 +122,22 @@ export function Dashboard({ token, config, logout }) {
</div>
</SettingsLayout>
</Modal>
<Modal title="Create Account Link" visible={state.showCreate} centered width="fitContent"
<Modal title="Create Account" visible={state.showCreate} centered width="fitContent"
footer={[ <Button type="primary" onClick={() => actions.setShowCreate(false)}>OK</Button> ]}
onCancel={() => actions.setShowCreate(false)}>
<CreateLayout>
<div class="url">
<div class="label">Browser Link:</div>
<div class="link">{createLink()}</div>
<Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(createLink())} />
</div>
<div class="url">
<div class="label">App Token:</div>
<div class="token">{state.createToken}</div>
<Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(state.createToken)} />
</div>
</CreateLayout>
</Modal>
</DashboardWrapper>

View File

@ -84,7 +84,21 @@ export const CreateLayout = styled.div`
display: flex;
flex-direction: row;
max-width: 100%;
padding-top: 8px;
.label {
padding-right: 16px;
width: 112px;
}
.token {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
min-width: 0;
padding-right: 8px;
}
.link {
text-overflow: ellipsis;
overflow: hidden;

View File

@ -78,15 +78,22 @@ export function AccountItem({ token, item, remove }) {
</>
)}
</div>
<Modal title="Access Account Link" visible={state.showAccess} centered width="fitContent"
<Modal title="Access Account" visible={state.showAccess} centered width="fitContent"
footer={[ <Button type="primary" onClick={() => actions.setShowAccess(false)}>OK</Button> ]}
onCancel={() => actions.setShowAccess(false)}>
<AccessLayout>
<div class="url">
<div class="label">Browser Link:</div>
<div class="link">{accessLink()}</div>
<Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(accessLink())}/>
</div>
<div class="url">
<div class="label">App Token:</div>
<div class="token">{state.accessToken}</div>
<Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(state.accessToken)} />
</div>
</AccessLayout>
</Modal>
</AccountItemWrapper>

View File

@ -88,7 +88,21 @@ export const AccessLayout = styled.div`
display: flex;
flex-direction: row;
width: 100%;
padding-top: 8px;
.label {
padding-right: 16px;
width: 112px;
}
.token {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
min-width: 0;
padding-right: 8px;
}
.link {
text-overflow: ellipsis;
overflow: hidden;