forked from MapComplete/MapComplete
		
	Use LoginToggle where possible,
This commit is contained in:
		
							parent
							
								
									e4c586ef99
								
							
						
					
					
						commit
						e31c87feab
					
				
					 9 changed files with 101 additions and 100 deletions
				
			
		|  | @ -13,6 +13,7 @@ import { SubtleButton } from "./Base/SubtleButton" | |||
| import { VariableUiElement } from "./Base/VariableUIElement" | ||||
| import Svg from "../Svg" | ||||
| import { ImportViewerLinks } from "./BigComponents/UserInformation" | ||||
| import {LoginToggle} from "./Popup/LoginButton"; | ||||
| 
 | ||||
| export default class AllThemesGui { | ||||
|     setup() { | ||||
|  | @ -29,12 +30,10 @@ export default class AllThemesGui { | |||
|                 intro, | ||||
|                 new FeaturedMessage().SetClass("mb-4 block"), | ||||
|                 new MoreScreen(state, true), | ||||
|                 new Toggle( | ||||
|                 new LoginToggle( | ||||
|                     undefined, | ||||
|                     new SubtleButton(undefined, Translations.t.index.logIn) | ||||
|                         .SetStyle("height:min-content") | ||||
|                         .onClick(() => state.osmConnection.AttemptLogin()), | ||||
|                     state.osmConnection.isLoggedIn | ||||
|                    Translations.t.index.logIn, | ||||
|                     state | ||||
|                 ), | ||||
|                 new ImportViewerLinks(state.osmConnection), | ||||
|                 Translations.t.general.aboutMapcomplete | ||||
|  |  | |||
|  | @ -1,7 +1,7 @@ | |||
| /** | ||||
|  * Asks to add a feature at the last clicked location, at least if zoom is sufficient | ||||
|  */ | ||||
| import { UIEventSource } from "../../Logic/UIEventSource" | ||||
| import { Store, UIEventSource } from "../../Logic/UIEventSource" | ||||
| import Svg from "../../Svg" | ||||
| import { SubtleButton } from "../Base/SubtleButton" | ||||
| import Combine from "../Base/Combine" | ||||
|  | @ -28,6 +28,7 @@ import Hash from "../../Logic/Web/Hash" | |||
| import { GlobalFilter } from "../../Logic/State/MapState" | ||||
| import { WayId } from "../../Models/OsmFeature" | ||||
| import { Tag } from "../../Logic/Tags/Tag" | ||||
| import { LoginToggle } from "../Popup/LoginButton" | ||||
| 
 | ||||
| /* | ||||
|  * The SimpleAddUI is a single panel, which can have multiple states: | ||||
|  | @ -44,7 +45,7 @@ export interface PresetInfo extends PresetConfig { | |||
|     boundsFactor?: 0.25 | number | ||||
| } | ||||
| 
 | ||||
| export default class SimpleAddUI extends Toggle { | ||||
| export default class SimpleAddUI extends LoginToggle { | ||||
|     /** | ||||
|      * | ||||
|      * @param isShown | ||||
|  | @ -59,6 +60,7 @@ export default class SimpleAddUI extends Toggle { | |||
|         filterViewIsOpened: UIEventSource<boolean>, | ||||
|         state: { | ||||
|             featureSwitchIsTesting: UIEventSource<boolean> | ||||
|             featureSwitchUserbadge: Store<boolean> | ||||
|             layoutToUse: LayoutConfig | ||||
|             osmConnection: OsmConnection | ||||
|             changes: Changes | ||||
|  | @ -74,10 +76,6 @@ export default class SimpleAddUI extends Toggle { | |||
|         }, | ||||
|         takeLocationFrom?: UIEventSource<{ lat: number; lon: number }> | ||||
|     ) { | ||||
|         const loginButton = new SubtleButton( | ||||
|             Svg.osm_logo_ui(), | ||||
|             Translations.t.general.add.pleaseLogin.Clone() | ||||
|         ).onClick(() => state.osmConnection.AttemptLogin()) | ||||
|         const readYourMessages = new Combine([ | ||||
|             Translations.t.general.readYourMessages.Clone().SetClass("alert"), | ||||
|             new SubtleButton(Svg.envelope_ui(), Translations.t.general.goToInbox, { | ||||
|  | @ -187,8 +185,8 @@ export default class SimpleAddUI extends Toggle { | |||
|                         userdetails.unreadMessages == 0 | ||||
|                 ) | ||||
|             ), | ||||
|             loginButton, | ||||
|             state.osmConnection.isLoggedIn | ||||
|             Translations.t.general.add.pleaseLogin, | ||||
|             state | ||||
|         ) | ||||
|     } | ||||
| 
 | ||||
|  |  | |||
|  | @ -16,6 +16,7 @@ import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig" | |||
| import { OsmConnection } from "../../Logic/Osm/OsmConnection" | ||||
| import { Changes } from "../../Logic/Osm/Changes" | ||||
| import Loading from "../Base/Loading" | ||||
| import {LoginToggle} from "../Popup/LoginButton"; | ||||
| 
 | ||||
| export class ImageUploadFlow extends Toggle { | ||||
|     private static readonly uploadCountsPerId = new Map<string, UIEventSource<number>>() | ||||
|  | @ -180,16 +181,12 @@ export class ImageUploadFlow extends Toggle { | |||
|             chosenLicense.SetClass("subtle text-sm"), | ||||
|         ]).SetClass("flex flex-col image-upload-flow mt-4 mb-8 text-center") | ||||
| 
 | ||||
|         const pleaseLoginButton = t.pleaseLogin | ||||
|             .Clone() | ||||
|             .onClick(() => state.osmConnection.AttemptLogin()) | ||||
|             .SetClass("login-button-friendly") | ||||
|         super( | ||||
|             new Toggle( | ||||
|             new LoginToggle( | ||||
|                 /*We can show the actual upload button!*/ | ||||
|                 uploadFlow, | ||||
|                 /* User not logged in*/ pleaseLoginButton, | ||||
|                 state?.osmConnection?.isLoggedIn | ||||
|                 /* User not logged in*/ t.pleaseLogin.Clone(), | ||||
|                 state | ||||
|             ), | ||||
|             undefined /* Nothing as the user badge is disabled*/, | ||||
|             state?.featureSwitchUserbadge | ||||
|  |  | |||
|  | @ -23,6 +23,7 @@ import { SubstitutedTranslation } from "../SubstitutedTranslation" | |||
| import FeaturePipelineState from "../../Logic/State/FeaturePipelineState" | ||||
| import TagRenderingQuestion from "./TagRenderingQuestion" | ||||
| import { OsmId } from "../../Models/OsmFeature" | ||||
| import { LoginToggle } from "./LoginButton" | ||||
| 
 | ||||
| export default class DeleteWizard extends Toggle { | ||||
|     /** | ||||
|  | @ -122,6 +123,40 @@ export default class DeleteWizard extends Toggle { | |||
|             ]).SetClass("flex mt-2 justify-between"), | ||||
|         ]).SetClass("question") | ||||
| 
 | ||||
|         const deleteFlow = new Toggle( | ||||
|             new Toggle( | ||||
|                 new Toggle( | ||||
|                     deleteDialog, | ||||
|                     new SubtleButton(Svg.envelope_ui(), t.readMessages), | ||||
|                     state.osmConnection.userDetails.map( | ||||
|                         (ud) => | ||||
|                             ud.csCount > | ||||
|                                 Constants.userJourney.addNewPointWithUnreadMessagesUnlock || | ||||
|                             ud.unreadMessages == 0 | ||||
|                     ) | ||||
|                 ), | ||||
| 
 | ||||
|                 deleteButton, | ||||
|                 confirm | ||||
|             ), | ||||
|             new VariableUiElement( | ||||
|                 deleteAbility.canBeDeleted.map((cbd) => | ||||
|                     new Combine([ | ||||
|                         Svg.delete_not_allowed_svg() | ||||
|                             .SetStyle("height: 2rem; width: auto") | ||||
|                             .SetClass("mr-2"), | ||||
|                         new Combine([ | ||||
|                             t.cannotBeDeleted, | ||||
|                             cbd.reason.SetClass("subtle"), | ||||
|                             t.useSomethingElse.SetClass("subtle"), | ||||
|                         ]).SetClass("flex flex-col"), | ||||
|                     ]).SetClass("flex m-2 p-2 rounded-lg bg-gray-200 bg-gray-200") | ||||
|                 ) | ||||
|             ), | ||||
| 
 | ||||
|             deleteAbility.canBeDeleted.map((cbd) => allowSoftDeletion || cbd.canBeDeleted !== false) | ||||
|         ) | ||||
| 
 | ||||
|         super( | ||||
|             new Toggle( | ||||
|                 new Combine([ | ||||
|  | @ -130,47 +165,7 @@ export default class DeleteWizard extends Toggle { | |||
|                     ), | ||||
|                     t.isDeleted, | ||||
|                 ]).SetClass("flex m-2 rounded-full"), | ||||
|                 new Toggle( | ||||
|                     new Toggle( | ||||
|                         new Toggle( | ||||
|                             new Toggle( | ||||
|                                 deleteDialog, | ||||
|                                 new SubtleButton(Svg.envelope_ui(), t.readMessages), | ||||
|                                 state.osmConnection.userDetails.map( | ||||
|                                     (ud) => | ||||
|                                         ud.csCount > | ||||
|                                             Constants.userJourney | ||||
|                                                 .addNewPointWithUnreadMessagesUnlock || | ||||
|                                         ud.unreadMessages == 0 | ||||
|                                 ) | ||||
|                             ), | ||||
| 
 | ||||
|                             deleteButton, | ||||
|                             confirm | ||||
|                         ), | ||||
|                         new VariableUiElement( | ||||
|                             deleteAbility.canBeDeleted.map((cbd) => | ||||
|                                 new Combine([ | ||||
|                                     Svg.delete_not_allowed_svg() | ||||
|                                         .SetStyle("height: 2rem; width: auto") | ||||
|                                         .SetClass("mr-2"), | ||||
|                                     new Combine([ | ||||
|                                         t.cannotBeDeleted, | ||||
|                                         cbd.reason.SetClass("subtle"), | ||||
|                                         t.useSomethingElse.SetClass("subtle"), | ||||
|                                     ]).SetClass("flex flex-col"), | ||||
|                                 ]).SetClass("flex m-2 p-2 rounded-lg bg-gray-200 bg-gray-200") | ||||
|                             ) | ||||
|                         ), | ||||
| 
 | ||||
|                         deleteAbility.canBeDeleted.map( | ||||
|                             (cbd) => allowSoftDeletion || cbd.canBeDeleted !== false | ||||
|                         ) | ||||
|                     ), | ||||
| 
 | ||||
|                     t.loginToDelete.onClick(state.osmConnection.AttemptLogin), | ||||
|                     state.osmConnection.isLoggedIn | ||||
|                 ), | ||||
|                 new LoginToggle(deleteFlow, undefined, state), | ||||
|                 isDeleted | ||||
|             ), | ||||
|             undefined, | ||||
|  |  | |||
|  | @ -23,6 +23,7 @@ import SearchAndGo from "../BigComponents/SearchAndGo" | |||
| import ChangeTagAction from "../../Logic/Osm/Actions/ChangeTagAction" | ||||
| import { And } from "../../Logic/Tags/And" | ||||
| import { Tag } from "../../Logic/Tags/Tag" | ||||
| import { LoginToggle } from "./LoginButton" | ||||
| 
 | ||||
| interface MoveReason { | ||||
|     text: Translation | string | ||||
|  | @ -220,7 +221,7 @@ export default class MoveWizard extends Toggle { | |||
| 
 | ||||
|         const dialogClasses = "p-2 md:p-4 m-2 border border-gray-400 rounded-xl flex flex-col" | ||||
| 
 | ||||
|         const moveFlow = new Toggle( | ||||
|         const moveFlow = new LoginToggle( | ||||
|             new VariableUiElement( | ||||
|                 currentStep.map((currentStep) => { | ||||
|                     switch (currentStep) { | ||||
|  | @ -246,8 +247,8 @@ export default class MoveWizard extends Toggle { | |||
|                     } | ||||
|                 }) | ||||
|             ), | ||||
|             loginButton, | ||||
|             state.osmConnection.isLoggedIn | ||||
|             undefined, | ||||
|             state | ||||
|         ) | ||||
|         let id = featureToMove.properties.id | ||||
|         const backend = state.osmConnection._oauth_config.url | ||||
|  |  | |||
|  | @ -7,6 +7,7 @@ import { VariableUiElement } from "../Base/VariableUIElement" | |||
| import TagRenderingConfig from "../../Models/ThemeConfig/TagRenderingConfig" | ||||
| import { Unit } from "../../Models/Unit" | ||||
| import Lazy from "../Base/Lazy" | ||||
| import { OsmServiceState } from "../../Logic/Osm/OsmConnection" | ||||
| 
 | ||||
| /** | ||||
|  * Generates all the questions, one by one | ||||
|  | @ -119,30 +120,34 @@ export default class QuestionBox extends VariableUiElement { | |||
|         ) | ||||
| 
 | ||||
|         super( | ||||
|             questionsToAsk.map((allQuestions) => { | ||||
|                 const els: BaseUIElement[] = [] | ||||
|                 if ( | ||||
|                     options.showAllQuestionsAtOnce === true || | ||||
|                     options.showAllQuestionsAtOnce["data"] | ||||
|                 ) { | ||||
|                     els.push(...questionsToAsk.data) | ||||
|                 } else { | ||||
|                     els.push(allQuestions[0]) | ||||
|                 } | ||||
|             questionsToAsk.map( | ||||
|                 (allQuestions) => { | ||||
|                     const apiState: OsmServiceState = state.osmConnection.apiIsOnline.data | ||||
|                     if (apiState !== "online" && apiState !== "unknown") { | ||||
|                         return undefined | ||||
|                     } | ||||
|                     const els: BaseUIElement[] = [] | ||||
|                     if ( | ||||
|                         options.showAllQuestionsAtOnce === true || | ||||
|                         options.showAllQuestionsAtOnce["data"] | ||||
|                     ) { | ||||
|                         els.push(...questionsToAsk.data) | ||||
|                     } else { | ||||
|                         els.push(allQuestions[0]) | ||||
|                     } | ||||
| 
 | ||||
|                 if (skippedQuestions.data.length > 0) { | ||||
|                     els.push(skippedQuestionsButton) | ||||
|                 } | ||||
|                     if (skippedQuestions.data.length > 0) { | ||||
|                         els.push(skippedQuestionsButton) | ||||
|                     } | ||||
| 
 | ||||
|                 return new Combine(els).SetClass("block mb-8") | ||||
|             }) | ||||
|                     return new Combine(els).SetClass("block mb-8") | ||||
|                 }, | ||||
|                 [state.osmConnection.apiIsOnline] | ||||
|             ) | ||||
|         ) | ||||
| 
 | ||||
|         this.skippedQuestions = skippedQuestions | ||||
|         this.restingQuestions = questionsToAsk | ||||
|         focus = () => | ||||
|             this.ScrollIntoView({ | ||||
|                 onlyIfPartiallyHidden: true, | ||||
|             }) | ||||
|         focus = () => this.ScrollIntoView() | ||||
|     } | ||||
| } | ||||
|  |  | |||
|  | @ -25,6 +25,7 @@ import FilteredLayer from "../../Models/FilteredLayer" | |||
| import BaseUIElement from "../BaseUIElement" | ||||
| import { VariableUiElement } from "../Base/VariableUIElement" | ||||
| import ScrollableFullScreen from "../Base/ScrollableFullScreen" | ||||
| import { LoginToggle } from "./LoginButton" | ||||
| 
 | ||||
| export default class SplitRoadWizard extends Combine { | ||||
|     // @ts-ignore
 | ||||
|  | @ -82,12 +83,7 @@ export default class SplitRoadWizard extends Combine { | |||
|             ) | ||||
|         ) | ||||
| 
 | ||||
|         // Only show the splitButton if logged in, else show login prompt
 | ||||
|         const loginBtn = t.loginToSplit | ||||
|             .Clone() | ||||
|             .onClick(() => state.osmConnection.AttemptLogin()) | ||||
|             .SetClass("login-button-friendly") | ||||
|         const splitToggle = new Toggle(splitButton, loginBtn, state.osmConnection.isLoggedIn) | ||||
|         const splitToggle = new LoginToggle(splitButton, t.loginToSplit.Clone(), state) | ||||
| 
 | ||||
|         // Save button
 | ||||
|         const saveButton = new Button(t.split.Clone(), async () => { | ||||
|  |  | |||
|  | @ -1,6 +1,6 @@ | |||
| import { InputElement } from "../Input/InputElement" | ||||
| import { Review } from "../../Logic/Web/Review" | ||||
| import { UIEventSource } from "../../Logic/UIEventSource" | ||||
| import { Store, UIEventSource } from "../../Logic/UIEventSource" | ||||
| import { TextField } from "../Input/TextField" | ||||
| import Translations from "../i18n/Translations" | ||||
| import Combine from "../Base/Combine" | ||||
|  | @ -11,6 +11,7 @@ import CheckBoxes from "../Input/Checkboxes" | |||
| import UserDetails, { OsmConnection } from "../../Logic/Osm/OsmConnection" | ||||
| import BaseUIElement from "../BaseUIElement" | ||||
| import Toggle from "../Input/Toggle" | ||||
| import { LoginToggle } from "../Popup/LoginButton" | ||||
| 
 | ||||
| export default class ReviewForm extends InputElement<Review> { | ||||
|     IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false) | ||||
|  | @ -20,11 +21,21 @@ export default class ReviewForm extends InputElement<Review> { | |||
|     private _saveButton: BaseUIElement | ||||
|     private readonly _isAffiliated: BaseUIElement | ||||
|     private readonly _postingAs: BaseUIElement | ||||
|     private readonly _osmConnection: OsmConnection | ||||
|     private readonly _state: { | ||||
|         readonly osmConnection: OsmConnection | ||||
|         readonly featureSwitchUserbadge: Store<boolean> | ||||
|     } | ||||
| 
 | ||||
|     constructor(onSave: (r: Review, doneSaving: () => void) => void, osmConnection: OsmConnection) { | ||||
|     constructor( | ||||
|         onSave: (r: Review, doneSaving: () => void) => void, | ||||
|         state: { | ||||
|             readonly osmConnection: OsmConnection | ||||
|             readonly featureSwitchUserbadge: Store<boolean> | ||||
|         } | ||||
|     ) { | ||||
|         super() | ||||
|         this._osmConnection = osmConnection | ||||
|         this._state = state | ||||
|         const osmConnection = state.osmConnection | ||||
|         this._value = new UIEventSource({ | ||||
|             made_by_user: new UIEventSource<boolean>(true), | ||||
|             rating: undefined, | ||||
|  | @ -112,12 +123,11 @@ export default class ReviewForm extends InputElement<Review> { | |||
|                     "    border: 2px solid var(--subtle-detail-color-contrast)" | ||||
|             ) | ||||
| 
 | ||||
|         const connection = this._osmConnection | ||||
|         const login = Translations.t.reviews.plz_login | ||||
|             .Clone() | ||||
|             .onClick(() => connection.AttemptLogin()) | ||||
| 
 | ||||
|         return new Toggle(form, login, connection.isLoggedIn).ConstructElement() | ||||
|         return new LoginToggle( | ||||
|             form, | ||||
|             Translations.t.reviews.plz_login.Clone(), | ||||
|             this._state | ||||
|         ).ConstructElement() | ||||
|     } | ||||
| 
 | ||||
|     IsValid(r: Review): boolean { | ||||
|  |  | |||
|  | @ -219,7 +219,7 @@ export default class SpecialVisualizations { | |||
|                     ) | ||||
|                     const form = new ReviewForm( | ||||
|                         (r, whenDone) => mangrove.AddReview(r, whenDone), | ||||
|                         state.osmConnection | ||||
|                         state | ||||
|                     ) | ||||
|                     return new ReviewElement(mangrove.GetSubjectUri(), mangrove.GetReviews(), form) | ||||
|                 }, | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue