idp.global/app
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): Bug fixes and UI enhancements

Browse Source
This commit is contained in:
Philipp Kunz
2024-10-07 15:14:44 +02:00
parent 46844fed58
commit a94d1875bd
13 changed files with 159 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ts_web/elements/account/views/baseview.ts
+39 -25
View File
@@ -67,24 +67,28 @@ export class BaseView extends DeesElement {
.orgGrid {
display: grid;
grid-gap: 16px;
grid-template-columns: ${cssManager.cssGridColumns(4, 16)}
grid-template-columns: ${cssManager.cssGridColumns(2, 16)};
}
.org {
padding: 16px;
border: 1px dotted #666;
border-radius: 3px;
border-top: 1px solid #444;
background: ${cssManager.bdTheme('#ccc', '#222')};
border-radius: 16px;
}
.org:hover {
cursor: pointer;
cursor: default;
background: ${cssManager.bdTheme('#CCC', '#333')};
}
`,
];
public render() {
return html` <div class="viewHost"></div> `;
return html`
<div class="viewHost">
</div> `;
}
public async firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {
@@ -147,33 +151,43 @@ export class BaseView extends DeesElement {
subscriptions.push(formSubscription);
button.addEventListener('clicked', async () => {
orgInput.disabled = true;
button.text = 'creating org...'
button.text = 'creating org...';
button.status = 'pending';
hint.innerHTML = 'Waiting for creation of the organization...'
hint.innerHTML = 'Waiting for creation of the organization...';
await state.accountState.dispatchAction(state.manifestNewOrgName, null);
hint.innerHTML = `The Organization with name ${state.accountState.getState().organizations[0].data.name} has been created!`
hint.innerHTML = `The Organization with name ${
state.accountState.getState().organizations[0].data.name
} has been created!`;
button.text = 'created!';
button.status = 'success';
const parentElement = (this.getRootNode() as any).host;
parentElement.subrouter.pushUrl(`/org/${state.accountState.getState().organizations[0].data.slug}/billing`);
parentElement.subrouter.pushUrl(
`/org/${state.accountState.getState().organizations[0].data.slug}/billing`
);
});
} else {
render(html`
<h1>Select An Organization</h1>
<div class="orgGrid">
${state.accountState.getState().organizations.map(orgArg => {
return html`
<div class="org" @click=${() => {
state.accountState.dispatchAction(state.setSelectedOrg, orgArg)
const parentElement = (this.getRootNode() as any).host;
parentElement.subrouter.pushUrl(`/org/${orgArg.data.slug}/billing`)
}}>
${orgArg.data.name}
</div>
`
})}
</div>
`, viewHost)
render(
html`
<h1>Select An Organization</h1>
<div class="orgGrid">
${state.accountState.getState().organizations.map((orgArg) => {
return html`
<div
class="org"
@click=${() => {
state.accountState.dispatchAction(state.setSelectedOrg, orgArg);
const parentElement = (this.getRootNode() as any).host;
parentElement.subrouter.pushUrl(`/org/${orgArg.data.slug}/billing`);
}}
>
<dees-icon .iconFA=${"wallet"} style="display: inline-block; transform: translateY(3px); padding-right: 4px;"></dees-icon> ${orgArg.data.name}
</div>
`;
})}
</div>
`,
viewHost
);
}
}
}