midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Fix review form save button

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-06-21 12:44:26 +02:00
parent b9b504aebc
commit aa1c9d0398
2 changed files with 27 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

2
UI/Popup/SaveButton.ts
View file

@ -28,7 +28,7 @@ export class SaveButton extends Toggle {
super( super(
save, save,
pleaseLogin, pleaseLogin,
osmConnection?.userDetails?.map(userDetails => userDetails.loggedIn) ?? new UIEventSource<any>(false) osmConnection?.isLoggedIn ?? new UIEventSource<any>(false)
) )
} }

41
UI/Reviews/ReviewForm.ts
View file

@ -14,6 +14,7 @@ import Toggle from "../Input/Toggle";
export default class ReviewForm extends InputElement<Review> { export default class ReviewForm extends InputElement<Review> {
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
private readonly _value: UIEventSource<Review>; private readonly _value: UIEventSource<Review>;
private readonly _comment: BaseUIElement; private readonly _comment: BaseUIElement;
private readonly _stars: BaseUIElement; private readonly _stars: BaseUIElement;
@ -22,11 +23,10 @@ export default class ReviewForm extends InputElement<Review> {
private readonly _postingAs: BaseUIElement; private readonly _postingAs: BaseUIElement;
private readonly _osmConnection: OsmConnection; private readonly _osmConnection: OsmConnection;
constructor(onSave: ((r: Review, doneSaving: (() => void)) => void), osmConnection: OsmConnection) { constructor(onSave: ((r: Review, doneSaving: (() => void)) => void), osmConnection: OsmConnection) {
super(); super();
this._osmConnection = osmConnection; this._osmConnection = osmConnection;
this._value = new UIEventSource({ this._value = new UIEventSource({
made_by_user: new UIEventSource<boolean>(true), made_by_user: new UIEventSource<boolean>(true),
rating: undefined, rating: undefined,
comment: undefined, comment: undefined,
@ -49,16 +49,29 @@ export default class ReviewForm extends InputElement<Review> {
this._postingAs = this._postingAs =
new Combine([Translations.t.reviews.posting_as.Clone(), new Combine([Translations.t.reviews.posting_as.Clone(),
new VariableUiElement(osmConnection.userDetails.map((ud: UserDetails) => ud.name)) new VariableUiElement(osmConnection.userDetails.map((ud: UserDetails) => ud.name))
.SetClass("review-author")]) .SetClass("review-author")])
.SetStyle("display:flex;flex-direction: column;align-items: flex-end;margin-left: auto;") .SetStyle("display:flex;flex-direction: column;align-items: flex-end;margin-left: auto;")
const reviewIsSaved = new UIEventSource<boolean>(false)
const reviewIsSaving = new UIEventSource<boolean>(false)
this._saveButton = this._saveButton =
new SaveButton(this._value.map(r => self.IsValid(r)), undefined) new Toggle(Translations.t.reviews.saved.Clone().SetClass("thanks"),
.onClick(() => { new Toggle(
self._saveButton = Translations.t.reviews.saving_review.Clone(); Translations.t.reviews.saving_review.Clone(),
onSave(this._value.data, () => { new SaveButton(
self._saveButton = Translations.t.reviews.saved.Clone().SetClass("thanks"); this._value.map(r => self.IsValid(r)), osmConnection
}); ).onClick(() => {
}).SetClass("break-normal") reviewIsSaving.setData(true),
onSave(this._value.data, () => {
reviewIsSaved.setData(true)
});
}),
reviewIsSaving
),
reviewIsSaved
).SetClass("break-normal")
this._isAffiliated = new CheckBoxes([Translations.t.reviews.i_am_affiliated.Clone()]) this._isAffiliated = new CheckBoxes([Translations.t.reviews.i_am_affiliated.Clone()])
@ -100,21 +113,19 @@ export default class ReviewForm extends InputElement<Review> {
Translations.t.reviews.tos.Clone().SetClass("subtle") Translations.t.reviews.tos.Clone().SetClass("subtle")
]) ])
.SetClass("flex flex-col p-4") .SetClass("flex flex-col p-4")
.SetStyle( "border-radius: 1em;" + .SetStyle("border-radius: 1em;" +
" background-color: var(--subtle-detail-color);" + " background-color: var(--subtle-detail-color);" +
" color: var(--subtle-detail-color-contrast);" + " color: var(--subtle-detail-color-contrast);" +
" border: 2px solid var(--subtle-detail-color-contrast)") " border: 2px solid var(--subtle-detail-color-contrast)")
const connection = this._osmConnection; const connection = this._osmConnection;
const login = Translations.t.reviews.plz_login.Clone().onClick(() => connection.AttemptLogin()) const login = Translations.t.reviews.plz_login.Clone().onClick(() => connection.AttemptLogin())
return new Toggle(form,login , return new Toggle(form, login,
connection.isLoggedIn) connection.isLoggedIn)
.ConstructElement() .ConstructElement()
} }
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
IsValid(r: Review): boolean { IsValid(r: Review): boolean {
if (r === undefined) { if (r === undefined) {
return false; return false;