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

fix(core): Update dependencies and refactor registration process

Browse Source
This commit is contained in:
Philipp Kunz
2024-10-04 15:43:36 +02:00
parent 629bf19845
commit 4deaafc3a2
18 changed files with 676 additions and 597 deletions
Download Patch File Download Diff File Expand all files Collapse all files
changelog.md
+8
View File
@@ -1,5 +1,13 @@
# Changelog
## 2024-10-04 - 1.2.2 - fix(core)
Update dependencies and refactor registration process
- Updated @design.estate/dees-catalog, @design.estate/dees-domtools, and @design.estate/dees-element dependencies to their latest versions.
- Refactored registration process to improve validation flow.
- Improved user interface for login and registration prompts.
- Fixed issues with email and token validation during registration.
## 2024-10-04 - 1.2.1 - fix(core)
Added logging for user email login process and fixed client URL parsing
package.json
+4 -4
View File
@@ -21,9 +21,9 @@
"@api.global/typedserver": "^3.0.51",
"@api.global/typedsocket": "^3.0.1",
"@consentsoftware_private/catalog": "^1.0.73",
"@design.estate/dees-catalog": "^1.1.8",
"@design.estate/dees-domtools": "^2.0.60",
"@design.estate/dees-element": "^2.0.38",
"@design.estate/dees-catalog": "^1.1.10",
"@design.estate/dees-domtools": "^2.0.61",
"@design.estate/dees-element": "^2.0.39",
"@push.rocks/lik": "^6.0.15",
"@push.rocks/qenv": "^6.0.5",
"@push.rocks/smartdata": "^5.2.10",
@@ -44,7 +44,7 @@
"@push.rocks/webjwt": "^1.0.9",
"@push.rocks/websetup": "^3.0.15",
"@push.rocks/webstore": "^2.0.20",
"@serve.zone/platformclient": "^1.0.11",
"@serve.zone/platformclient": "^1.1.0",
"@tsclass/tsclass": "^4.1.2",
"@uptime.link/webwidget": "^1.1.2"
},
pnpm-lock.yaml
Generated
+297 -294
View File
File diff suppressed because it is too large Load Diff
ts/00_commitinfo_data.ts
+1 -1
View File
@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@idp.global/idp.global',
version: '1.2.1',
version: '1.2.2',
description: 'An identity provider software managing user authentications, registrations, and sessions.'
}
ts/index.ts
+1
View File
@@ -20,6 +20,7 @@ export const runCli = async () => {
mongoDbUrl: await serviceQenv.getEnvVarOnDemand('MONGO_DB_URL'),
},
websiteServer: websiteServer,
baseUrl: await serviceQenv.getEnvVarOnDemand('IDP_BASEURL'),
});
await reception.start();
ts/reception/classes.reception.ts
+2
View File
@@ -21,6 +21,7 @@ export interface IReceptionOptions {
name: string;
mongoDescriptor: plugins.smartdata.IMongoDescriptor;
websiteServer: plugins.typedserver.utilityservers.UtilityWebsiteServer;
baseUrl: string;
}
export class Reception {
@@ -55,6 +56,7 @@ export class Reception {
* starts the reception instance
*/
public async start() {
await this.szPlatformClient.init(await this.serviceQenv.getEnvVarOnDemand('SERVEZONE_PLATFROM_AUTHORIZATION'));
logger.log('info', 'starting reception');
logger.log('info', 'adding typedrouter to website server');
this.options.websiteServer.typedrouter.addTypedRouter(this.typedrouter);
ts/reception/classes.receptionmailer.ts
+3 -3
View File
@@ -152,9 +152,9 @@ export class ReceptionMailer {
</html>
`;
public sendRegistrationEmail(signupSessionArg: RegistrationSession, validationTokenArg: string) {
public async sendRegistrationEmail(signupSessionArg: RegistrationSession, validationTokenArg: string) {
this.receptionRef.szPlatformClient.emailConnector.sendEmail({
from: 'workspace.global <noreply@mail.workspace.global>',
from: `idp.global@${this.receptionRef.options.baseUrl} <noreply@mail.workspace.global>`,
title: 'Verify your Email Address!',
to: signupSessionArg.emailAddress,
body: this.createBodyString(`
@@ -163,7 +163,7 @@ export class ReceptionMailer {
}">${signupSessionArg.emailAddress}</a></h1>
<p>It looks like you requested to register an account with us. We just want to make sure it really was you.</p>
<p>In case it was you, <b>please continue with the registration process by clicking the button below</b>. Otherwise, please ignore this email.</p>
<a href="https://registration.workspace.global/finishregistration?validationtoken=${encodeURI(
<a href="${this.receptionRef.options.baseUrl}/finishregistration?validationtoken=${encodeURI(
validationTokenArg
)}"><div class="button">
continue with registration
ts/reception/classes.registrationsessionmanager.ts
+1
View File
@@ -63,6 +63,7 @@ export class RegistrationSessionManager {
new plugins.typedrequest.TypedHandler<plugins.lointReception.request.IReq_AfterRegistrationEmailClicked>(
'afterRegistrationEmailClicked',
async (requestData) => {
console.log(requestData);
const signupSession = await this.registrationSessions.find(async (itemArg) =>
itemArg.validateEmailToken(requestData.token)
);
ts_web/00_commitinfo_data.ts
+1 -1
View File
@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@idp.global/idp.global',
version: '1.2.1',
version: '1.2.2',
description: 'An identity provider software managing user authentications, registrations, and sessions.'
}
ts_web/elements/idp-logincontainer.ts → ts_web/elements/idp-centercontainer.ts
+28 -11
View File
@@ -16,13 +16,13 @@ import { IdpState } from '../idp.state.js';
declare global {
interface HTMLElementTagNameMap {
'idp-logincontainer': IdpLogincontainer;
'idp-centercontainer': IdpCenterContainer;
}
}
@customElement('idp-logincontainer')
export class IdpLogincontainer extends DeesElement {
public static demo = () => html`<idp-logincontainer></idp-logincontainer>`;
@customElement('idp-centercontainer')
export class IdpCenterContainer extends DeesElement {
public static demo = () => html`<idp-centercontainer></idp-centercontainer>`;
constructor() {
super();
@@ -47,9 +47,9 @@ export class IdpLogincontainer extends DeesElement {
justify-content: center;
align-items: center;
opacity: 0;
transition: all 0.2s;
transition-delay: 0.2s;
transform: translate3d(0px, 20px, 0px);
transition: all 0.1s;
transition-delay: 0.05s;
transform: translate3d(0px, 8px, 0px);
pointer-events: none;
}
@@ -107,23 +107,40 @@ export class IdpLogincontainer extends DeesElement {
<div class="loginblock">
<h1>idp.global</h1>
<div class="contentSpacer">
<idp-login></idp-login>
<slot></slot>
</div>
<div class="legalinfo">
<a href="https://legal.task.vc/" target="_blank">Legal Info</a>
| <a href="https://task.vc/" target="_blank">Company Website</a>
| <a href="https://support.task.vc/" target="_blank">Support</a>
| SSO v${commitinfo.version}
| idp.global v${commitinfo.version}
</div>
</div>
</div>
`;
}
public async firstUpdated() {
public async show() {
await this.updateComplete;
const domtoolsInstance = await this.domtoolsPromise;
const done = plugins.smartpromise.defer();
requestAnimationFrame(async () => {
this.shadowRoot.querySelector('.mainContainer').classList.add('show');
this.shadowRoot.querySelector('idp-login').focus();
await domtoolsInstance.convenience.smartdelay.delayFor(200);
done.resolve();
});
return done.promise;
}
public async hide() {
await this.updateComplete;
const domtoolsInstance = await this.domtoolsPromise;
const done = plugins.smartpromise.defer();
requestAnimationFrame(async () => {
this.shadowRoot.querySelector('.mainContainer').classList.remove('show');
await domtoolsInstance.convenience.smartdelay.delayFor(200);
done.resolve();
});
return done.promise;
}
}
ts_web/elements/idp-loginprompt.ts
+26 -6
View File
@@ -17,16 +17,17 @@ import '@uptime.link/webwidget';
import '@design.estate/dees-catalog';
import { DeesForm, DeesFormSubmit, DeesInputText } from '@design.estate/dees-catalog';
import { IdpState } from '../idp.state.js';
declare global {
interface HTMLElementTagNameMap {
'idp-login': IdpLogin;
'idp-loginprompt': IdpLoginPrompt;
}
}
@customElement('idp-login')
export class IdpLogin extends DeesElement {
public static demo = () => html`<idp-login></idp-login>`;
@customElement('idp-loginprompt')
export class IdpLoginPrompt extends DeesElement {
public static demo = () => html`<idp-loginprompt></idp-loginprompt>`;
@property()
public productOfInterest: string;
@@ -68,6 +69,7 @@ export class IdpLogin extends DeesElement {
public render(): TemplateResult {
return html`
<idp-centercontainer>
<div class="boxcontent">
<dees-form
id="loginForm"
@@ -92,8 +94,12 @@ export class IdpLogin extends DeesElement {
></dees-input-text>
<dees-form-submit id="loginSubmitButton"></dees-form-submit>
</dees-form>
<dees-button type="discreet" class="registerButton">Register instead</dees-button>
<dees-button type="discreet" class="registerButton" @click=${async () => {
const idpState = await IdpState.getSingletonInstance();
idpState.domtools.router.pushUrl('/register');
}}>Register instead</dees-button>
</div>
</idp-centercontainer>
`;
}
@@ -206,6 +212,20 @@ export class IdpLogin extends DeesElement {
}
public async focus() {
(this.shadowRoot.querySelector('#loginEmailInput') as plugins.deesCatalog.DeesInputText).focus();
(
this.shadowRoot.querySelector('#loginEmailInput') as plugins.deesCatalog.DeesInputText
).focus();
}
public async show() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.show();
}
public async hide() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.hide();
}
}
ts_web/elements/idp-registerprompt.ts
+23 -8
View File
@@ -17,6 +17,7 @@ import '@uptime.link/webwidget';
import '@design.estate/dees-catalog';
import { DeesForm, DeesFormSubmit, DeesInputText } from '@design.estate/dees-catalog';
import { IdpState } from '../idp.state.js';
declare global {
interface HTMLElementTagNameMap {
@@ -56,14 +57,6 @@ export class IdpRegistrationPrompt extends DeesElement {
color: ${cssManager.bdTheme('#333333', '#ffffff')};
}
.box {
opacity: 0;
cursor: pointer;
overflow: hidden;
transition: all 0.2s ease;
height: 0px;
}
.boxcontent {
margin: 0px 20px;
}
@@ -79,11 +72,16 @@ export class IdpRegistrationPrompt extends DeesElement {
color: #fff;
transform: scale(1.02);
}
.loginButton {
margin-top: 16px;
}
`,
];
public render(): TemplateResult {
return html`
<idp-centercontainer>
<div class="boxcontent">
<dees-form
id="registrationForm"
@@ -103,7 +101,12 @@ export class IdpRegistrationPrompt extends DeesElement {
></dees-input-checkbox>
<dees-form-submit>Send Verification Email</dees-form-submit>
</dees-form>
<dees-button type="discreet" class="loginButton" @click=${async () => {
const idpState = await IdpState.getSingletonInstance();
idpState.domtools.router.pushUrl('/login');
}}>Login instead</dees-button>
</div>
</idp-centercontainer>
`;
}
@@ -186,4 +189,16 @@ export class IdpRegistrationPrompt extends DeesElement {
return null;
}
}
public async show() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.show();
}
public async hide() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.hide();
}
}
ts_web/elements/idp-registration-stepper.ts
+19 -28
View File
@@ -14,7 +14,6 @@ import {
@customElement('idp-registration-stepper')
export class IdpRegistrationStepper extends DeesElement {
@state()
private usedSubTemplate: TemplateResult;
@@ -67,43 +66,42 @@ export class IdpRegistrationStepper extends DeesElement {
public async firstUpdated() {
const idpState = await IdpState.getSingletonInstance();
await this.domtoolsPromise;
this.domtools.router.on(`/finishregistration`, async (routeArg) => {
this.storedData.validationTokenUrlParam = routeArg.queryParams.validationtoken;
const parsedUrl = plugins.smarturl.Smarturl.createFromUrl(window.location.href);
this.storedData.validationTokenUrlParam = parsedUrl.searchParams['validationtoken'];
console.log(`validationToken is ${this.storedData.validationTokenUrlParam}`);
if (!this.storedData.validationTokenUrlParam) {
this.usedSubTemplate = html`
You need a validation token, but we couldn't find one. Please contact workspace.global support.
You need a validation token, but we couldn't find one. Please contact workspace.global
support.
`;
await this.domtools.convenience.smartdelay.delayFor(5000);
this.usedSubTemplate = html` Redirecting you to workspace.global support... `;
await this.domtools.convenience.smartdelay.delayFor(2000);
window.location.href = 'https://support.workspace.global';
window.location.href = '/';
return;
}
// lets verify the info;
let tokenErrorMessage: string;
const resAfterRegEmailClicked =
await idpState.idpClient.requests.afterRegistrationEmailClicked
const resAfterRegEmailClicked = await idpState.idpClient.requests.afterRegistrationEmailClicked
.fire({
token: this.storedData.validationTokenUrlParam,
})
.catch(
(
err: typeof DeesElement['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
err: (typeof DeesElement)['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
) => {
tokenErrorMessage = err.errorText;
return;
}
);
console.log(resAfterRegEmailClicked);
if (!resAfterRegEmailClicked || !resAfterRegEmailClicked.email) {
this.usedSubTemplate = html`
the supplied validation token does not match any registration sessions.<br />
${tokenErrorMessage ? html`Reason: ${tokenErrorMessage}` : null}
`;
await this.domtools.convenience.smartdelay.delayFor(5000);
this.usedSubTemplate = html`redirecting you for further support... `;
await this.domtools.convenience.smartdelay.delayFor(1000);
window.location.href = 'https://support.workspace.global';
idpState.domtools.router.pushUrl('/');
return;
} else {
this.storedData.email = resAfterRegEmailClicked.email;
@@ -143,7 +141,7 @@ export class IdpRegistrationStepper extends DeesElement {
})
.catch(
(
errArg: typeof DeesElement['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
errArg: (typeof DeesElement)['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
) => {
deesForm.setStatus('error', errArg.errorText);
}
@@ -179,7 +177,7 @@ export class IdpRegistrationStepper extends DeesElement {
})
.catch(
(
errArg: typeof DeesElement['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
errArg: (typeof DeesElement)['prototype']['domtools']['convenience']['typedrequest']['TypedResponseError']['prototype']
) => {
deesForm.setStatus('error', errArg.errorText);
}
@@ -262,12 +260,11 @@ export class IdpRegistrationStepper extends DeesElement {
deesForm.setStatus('pending', 'User created!');
await this.domtools.convenience.smartdelay.delayFor(500);
deesForm.setStatus('pending', 'Obtaining Refresh Token...');
const loginResponse = await idpState.idpClient.requests.loginWithUserNameAndPassword.fire(
{
const loginResponse =
await idpState.idpClient.requests.loginWithUserNameAndPassword.fire({
username: this.storedData.email,
password: eventArg.detail.data.password,
}
);
});
this.storedData.refreshToken = loginResponse.refreshToken;
deesForm.setStatus('pending', 'Obtaining JWT...');
@@ -277,20 +274,14 @@ export class IdpRegistrationStepper extends DeesElement {
deesForm.setStatus('pending', 'Obtaining Transfer Token...');
await idpState.idpClient.setJwt(jwtResponse.jwt);
await idpState.idpClient.getTransferTokenAndSwitchToLocation('https://sso.workspace.global/afterregistration');
await idpState.idpClient.getTransferTokenAndSwitchToLocation(
'https://sso.workspace.global/afterregistration'
);
});
},
},
] as plugins.deesCatalog.IStep[]}
></dees-stepper>`;
await this.domtools.convenience.smartdelay.delayFor(100);
});
this.domtools.router.on('/', async () => {
this.usedSubTemplate = html`Hm, this is app is not meant for what you are trying to do :) `;
await this.domtools.convenience.smartdelay.delayFor(2000);
this.usedSubTemplate = html`Redirecting you now...`;
window.location.href = `https://workspace.global`;
});
this.domtools.router._handleRouteState();
}
}
ts_web/elements/idp-welcome.ts
+6 -3
View File
@@ -38,8 +38,8 @@ export class IdpWelcome extends DeesElement {
font-family: 'Cal Sans';
text-align: center;
font-size: 24px;
margin: 24px auto;
padding: 0px 24px;
margin: 0px auto;
padding: 24px 24px 0px 24px;
width: 500px;
letter-spacing:0.0125em;
}
@@ -70,7 +70,10 @@ export class IdpWelcome extends DeesElement {
const idpState = await IdpState.getSingletonInstance();
idpState.domtools.router.pushUrl('/login');
}}>Sign In</dees-button>
<dees-button @click=${() => {}}>Register</dees-button>
<dees-button @click=${async () => {
const idpState = await IdpState.getSingletonInstance();
idpState.domtools.router.pushUrl('/register');
}}>Register</dees-button>
</div>
<div class="textbox">
ts_web/elements/index.ts
+1 -1
View File
@@ -1,5 +1,5 @@
export * from './idp-registration-stepper.js';
export * from './idp-logincontainer.js';
export * from './idp-centercontainer.js';
export * from './idp-loginprompt.js';
export * from './idp-registerprompt.js';
export * from './idp-transfermanager.js';
ts_web/idp.state.ts
+9 -2
View File
@@ -15,11 +15,11 @@ export class IdpState {
}
// INSTANCE
public receptionUrl = 'https://reception.lossless.one/typedrequest';
public receptionUrl = window.location.origin;
public idpClient = new plugins.idpClient.IdpClient(this.receptionUrl);
public domtools: domtools.DomTools;
public mainStatePart: plugins.deesDomtools.plugins.smartstate.StatePart<'main', {
view: 'welcome' | 'login' | 'register';
view: 'welcome' | 'login' | 'register' | 'finishregistration';
}>
public async init() {
@@ -49,6 +49,13 @@ export class IdpState {
view: 'register',
})
});
this.domtools.router.on('/finishregistration', async () => {
await this.mainStatePart.setState({
...this.mainStatePart.getState(),
view: 'finishregistration',
})
});
this.domtools.router._handleRouteState();
}
}
ts_web/index.ts
+1 -1
View File
@@ -44,7 +44,7 @@ const run = async () => {
},
});
const serviceWorker = await serviceworker.getServiceworkerClient();
// const serviceWorker = await serviceworker.getServiceworkerClient();
const mainTemplate = html`
<style>
ts_web/views/viewcontainer.ts
+13 -2
View File
@@ -61,14 +61,23 @@ export class IdpViewcontainer extends DeesElement {
// Remove the current element if it exists
if (this.currentElement) {
const currentElement = this.currentElement as any;
if (currentElement.hide) {
await currentElement.hide();
}
viewContainer.removeChild(this.currentElement);
}
// Create a new instance of the viewElement
const newElement = new viewElement();
const newElement = new viewElement() as any;
(newElement as any).viewContainer = this;
viewContainer.appendChild(newElement);
if (newElement.show) {
await newElement.show();
}
// Wait until the new element is fully rendered
await newElement.updateComplete;
@@ -87,11 +96,13 @@ export class IdpViewcontainer extends DeesElement {
break;
case 'login':
console.log('now on /login');
await this.loadElement(elements.IdpLogincontainer);
await this.loadElement(elements.IdpLoginPrompt);
break;
case 'register':
await this.loadElement(elements.IdpRegistrationPrompt);
break;
case 'finishregistration':
await this.loadElement(elements.IdpRegistrationStepper);
}
});
}