refactor /create/index controller to component (#760)

This commit is contained in:
Jeldrik Hanschke 2023-12-16 23:22:43 +01:00 committed by GitHub
parent 41d6b90099
commit 4950e327ed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 102 additions and 137 deletions

View file

@ -0,0 +1,42 @@
<div class="cr-form-wrapper box">
<BsForm
@formLayout="horizontal"
@model={{@formData}}
@onSubmit={{this.submit}}
as |form|
>
<form.element
@label={{t "create.index.input.pollType.label"}}
@property="pollType"
@showValidationOn={{array "change" "focusOut"}}
@useIcons={{false}}
class="poll-type"
data-test-form-element="poll-type"
as |el|
>
<select
id={{el.id}}
class="form-control"
required
{{on "change" (pick "target.value" el.setValue)}}
{{autofocus}}
>
<option value="FindADate" selected={{eq el.value "FindADate"}}>
{{t "pollTypes.findADate.label"}}
</option>
<option value="MakeAPoll" selected={{eq el.value "MakeAPoll"}}>
{{t "pollTypes.makeAPoll.label"}}
</option>
</select>
</form.element>
<div class="row cr-steps-bottom-nav">
<div class="col-6 col-md-8 order-12">
<NextButton />
</div>
<div class="col-6 col-md-4 order-1 text-right">
<BackButton disabled />
</div>
</div>
</BsForm>
</div>

View file

@ -0,0 +1,38 @@
import Component from '@glimmer/component';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';
import { registerDestructor } from '@ember/destroyable';
import type RouterService from '@ember/routing/router-service';
import type { CreateIndexRouteModel } from '../routes/create/index';
export interface CreateOptionsIndexSignature {
Args: {
formData: CreateIndexRouteModel['formData'];
poll: CreateIndexRouteModel['poll'];
};
}
export default class CreateIndexComponent extends Component<CreateOptionsIndexSignature> {
@service declare router: RouterService;
@action
submit() {
this.router.transitionTo('create.meta');
}
constructor(owner: unknown, args: CreateOptionsIndexSignature['Args']) {
super(owner, args);
registerDestructor(this, () => {
const { poll, formData } = this.args;
poll.pollType = formData.pollType;
});
}
}
declare module '@glint/environment-ember-loose/registry' {
export default interface Registry {
CreateIndex: typeof CreateIndexComponent;
}
}

View file

@ -14,6 +14,10 @@ export default class SharePollUrlComponent extends Component {
// directory from which Croodle is served. // directory from which Croodle is served.
const relativeUrl = this.router.currentURL; const relativeUrl = this.router.currentURL;
if (!relativeUrl) {
throw new Error('Relative URL is `null`. Cannot calculate poll URL.');
}
// The URL under which Croodle is served, is not known at // The URL under which Croodle is served, is not known at
// build-time. But we can construct it ourself, by parsing // build-time. But we can construct it ourself, by parsing
// window.location.href and replacing the hash part. // window.location.href and replacing the hash part.

View file

@ -8,9 +8,7 @@ declare const config: {
podModulePrefix: string; podModulePrefix: string;
locationType: 'history' | 'hash' | 'none'; locationType: 'history' | 'hash' | 'none';
rootURL: string; rootURL: string;
APP: { APP: Record<string, unknown>;
version: string;
};
}; };
export default config; export default config;

View file

@ -1,33 +0,0 @@
import Controller from '@ember/controller';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';
import type RouterService from '@ember/routing/router-service';
import type Transition from '@ember/routing/transition';
import type { CreateIndexRouteModel } from 'croodle/routes/create/index';
export default class CreateIndex extends Controller {
@service declare router: RouterService;
declare model: CreateIndexRouteModel;
@action
submit() {
this.router.transitionTo('create.meta');
}
@action
handleTransition(transition: Transition) {
if (transition.from?.name === 'create.index') {
const { poll, formData } = this.model;
poll.pollType = formData.pollType;
}
}
constructor() {
// eslint-disable-next-line prefer-rest-params
super(...arguments);
this.router.on('routeWillChange', this.handleTransition);
}
}

View file

@ -70,7 +70,9 @@ export default class PollParticipationController extends Controller {
const { poll } = model; const { poll } = model;
// As know that the route is `poll.participation`, which means that there // As know that the route is `poll.participation`, which means that there
// is a parent `poll` for sure. // is a parent `poll` for sure.
const { encryptionKey } = this.router.currentRoute.parent!.queryParams; const { encryptionKey } = this.router.currentRoute?.parent?.queryParams as {
encryptionKey: string;
};
if (!userData) { if (!userData) {
throw new Error( throw new Error(

View file

@ -220,7 +220,7 @@ export default class Poll {
passphrase: string, passphrase: string,
) { ) {
const creationDate = new Date().toISOString(); const creationDate = new Date().toISOString();
const version = config.APP.version; const version = config.APP['version'] as string;
const timezone = const timezone =
pollType === 'FindADate' && pollType === 'FindADate' &&
options.some(({ title }) => { options.some(({ title }) => {

View file

@ -46,7 +46,7 @@ export default class User {
passphrase: string, passphrase: string,
) { ) {
const creationDate = new Date().toISOString(); const creationDate = new Date().toISOString();
const version = config.APP.version; const version = config.APP['version'] as string;
const payload = { const payload = {
user: { user: {

View file

@ -28,7 +28,7 @@ export default class CreateRoute extends Route {
beforeModel(transition: Transition) { beforeModel(transition: Transition) {
// enforce that wizzard is started at create.index // enforce that wizzard is started at create.index
if (transition.to.name !== 'create.index') { if (transition.to?.name !== 'create.index') {
this.router.transitionTo('create.index'); this.router.transitionTo('create.index');
} }
} }

View file

@ -18,7 +18,7 @@ export default class PollRoute extends Route {
} }
redirect(poll: Poll, transition: Transition) { redirect(poll: Poll, transition: Transition) {
if (transition.to.name === 'poll.index') { if (transition.to?.name === 'poll.index') {
const { encryptionKey } = this.paramsFor(this.routeName) as { const { encryptionKey } = this.paramsFor(this.routeName) as {
encryptionKey: string; encryptionKey: string;
}; };

View file

@ -1,42 +1 @@
<div class="cr-form-wrapper box"> <CreateIndex @formData={{@model.formData}} @poll={{@model.poll}} />
<BsForm
@formLayout="horizontal"
@model={{@model.formData}}
@onSubmit={{this.submit}}
as |form|
>
<form.element
@label={{t "create.index.input.pollType.label"}}
@property="pollType"
@showValidationOn={{array "change" "focusOut"}}
@useIcons={{false}}
class="poll-type"
data-test-form-element="poll-type"
as |el|
>
<select
id={{el.id}}
class="form-control"
required
{{on "change" (pick "target.value" el.setValue)}}
{{autofocus}}
>
<option value="FindADate" selected={{eq el.value "FindADate"}}>
{{t "pollTypes.findADate.label"}}
</option>
<option value="MakeAPoll" selected={{eq el.value "MakeAPoll"}}>
{{t "pollTypes.makeAPoll.label"}}
</option>
</select>
</form.element>
<div class="row cr-steps-bottom-nav">
<div class="col-6 col-md-8 order-12">
<NextButton />
</div>
<div class="col-6 col-md-4 order-1 text-right">
<BackButton disabled />
</div>
</div>
</BsForm>
</div>

62
package-lock.json generated
View file

@ -7890,16 +7890,6 @@
"@simple-dom/interface": "^1.4.0" "@simple-dom/interface": "^1.4.0"
} }
}, },
"node_modules/@glimmer/manager/node_modules/@glimmer/validator": {
"version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
},
"node_modules/@glimmer/node": { "node_modules/@glimmer/node": {
"version": "0.84.3", "version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/node/-/node-0.84.3.tgz", "resolved": "https://registry.npmjs.org/@glimmer/node/-/node-0.84.3.tgz",
@ -8019,16 +8009,6 @@
"@simple-dom/interface": "^1.4.0" "@simple-dom/interface": "^1.4.0"
} }
}, },
"node_modules/@glimmer/reference/node_modules/@glimmer/validator": {
"version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
},
"node_modules/@glimmer/runtime": { "node_modules/@glimmer/runtime": {
"version": "0.84.3", "version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/runtime/-/runtime-0.84.3.tgz", "resolved": "https://registry.npmjs.org/@glimmer/runtime/-/runtime-0.84.3.tgz",
@ -8061,16 +8041,6 @@
"@simple-dom/interface": "^1.4.0" "@simple-dom/interface": "^1.4.0"
} }
}, },
"node_modules/@glimmer/runtime/node_modules/@glimmer/validator": {
"version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
},
"node_modules/@glimmer/syntax": { "node_modules/@glimmer/syntax": {
"version": "0.84.3", "version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/syntax/-/syntax-0.84.3.tgz", "resolved": "https://registry.npmjs.org/@glimmer/syntax/-/syntax-0.84.3.tgz",
@ -8111,10 +8081,14 @@
"dev": true "dev": true
}, },
"node_modules/@glimmer/validator": { "node_modules/@glimmer/validator": {
"version": "0.44.0", "version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.44.0.tgz", "resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-i01plR0EgFVz69GDrEuFgq1NheIjZcyTy3c7q+w7d096ddPVeVcRzU3LKaqCfovvLJ+6lJx40j45ecycASUUyw==", "integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true "dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
}, },
"node_modules/@glimmer/vm": { "node_modules/@glimmer/vm": {
"version": "0.84.3", "version": "0.84.3",
@ -32680,16 +32654,6 @@
"@simple-dom/interface": "^1.4.0" "@simple-dom/interface": "^1.4.0"
} }
}, },
"node_modules/ember-source/node_modules/@glimmer/validator": {
"version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
},
"node_modules/ember-source/node_modules/@types/fs-extra": { "node_modules/ember-source/node_modules/@types/fs-extra": {
"version": "5.1.0", "version": "5.1.0",
"resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-5.1.0.tgz", "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-5.1.0.tgz",
@ -34326,16 +34290,6 @@
"node": "12.* || 14.* || >= 16.*" "node": "12.* || 14.* || >= 16.*"
} }
}, },
"node_modules/ember-template-recast/node_modules/@glimmer/validator": {
"version": "0.84.3",
"resolved": "https://registry.npmjs.org/@glimmer/validator/-/validator-0.84.3.tgz",
"integrity": "sha512-RTBV4TokUB0vI31UC7ikpV7lOYpWUlyqaKV//pRC4pexYMlmqnVhkFrdiimB/R1XyNdUOQUmnIAcdic39NkbhQ==",
"dev": true,
"dependencies": {
"@glimmer/env": "^0.1.7",
"@glimmer/global-context": "0.84.3"
}
},
"node_modules/ember-template-recast/node_modules/ansi-styles": { "node_modules/ember-template-recast/node_modules/ansi-styles": {
"version": "4.3.0", "version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",

View file

@ -136,6 +136,7 @@
"webpack": "5.89.0" "webpack": "5.89.0"
}, },
"overrides": { "overrides": {
"@glimmer/validator": "0.84.3",
"ember-element-helper": "0.8.5" "ember-element-helper": "0.8.5"
}, },
"engines": { "engines": {