This commit is contained in:
balzack 2022-09-10 23:40:32 -07:00
commit b23fed9726
4 changed files with 46 additions and 4 deletions

View File

@ -122,15 +122,22 @@ export function Dashboard({ token, config, logout }) {
</div> </div>
</SettingsLayout> </SettingsLayout>
</Modal> </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> ]} footer={[ <Button type="primary" onClick={() => actions.setShowCreate(false)}>OK</Button> ]}
onCancel={() => actions.setShowCreate(false)}> onCancel={() => actions.setShowCreate(false)}>
<CreateLayout> <CreateLayout>
<div class="url"> <div class="url">
<div class="label">Browser Link:</div>
<div class="link">{createLink()}</div> <div class="link">{createLink()}</div>
<Button icon={<CopyOutlined />} size="small" <Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(createLink())} /> onClick={() => onClipboard(createLink())} />
</div> </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> </CreateLayout>
</Modal> </Modal>
</DashboardWrapper> </DashboardWrapper>

View File

@ -84,6 +84,20 @@ export const CreateLayout = styled.div`
display: flex; display: flex;
flex-direction: row; flex-direction: row;
max-width: 100%; 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 { .link {
text-overflow: ellipsis; text-overflow: ellipsis;

View File

@ -78,15 +78,22 @@ export function AccountItem({ token, item, remove }) {
</> </>
)} )}
</div> </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> ]} footer={[ <Button type="primary" onClick={() => actions.setShowAccess(false)}>OK</Button> ]}
onCancel={() => actions.setShowAccess(false)}> onCancel={() => actions.setShowAccess(false)}>
<AccessLayout> <AccessLayout>
<div class="url"> <div class="url">
<div class="label">Browser Link:</div>
<div class="link">{accessLink()}</div> <div class="link">{accessLink()}</div>
<Button icon={<CopyOutlined />} size="small" <Button icon={<CopyOutlined />} size="small"
onClick={() => onClipboard(accessLink())}/> onClick={() => onClipboard(accessLink())}/>
</div> </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> </AccessLayout>
</Modal> </Modal>
</AccountItemWrapper> </AccountItemWrapper>

View File

@ -88,6 +88,20 @@ export const AccessLayout = styled.div`
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; 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 { .link {
text-overflow: ellipsis; text-overflow: ellipsis;