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

Use LoginToggle where possible,

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-01-06 03:37:22 +01:00
parent e4c586ef99
commit e31c87feab
9 changed files with 101 additions and 100 deletions
Download patch file Download diff file Expand all files Collapse all files

9
UI/AllThemesGui.ts
View file

@ -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

14
UI/BigComponents/SimpleAddUI.ts
View file

@ -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
)
}

11
UI/Image/ImageUploadFlow.ts
View file

@ -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

77
UI/Popup/DeleteWizard.ts
View file

@ -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,

7
UI/Popup/MoveWizard.ts
View file

@ -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

43
UI/Popup/QuestionBox.ts
View file

@ -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()
}
}

8
UI/Popup/SplitRoadWizard.ts
View file

@ -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 () => {

30
UI/Reviews/ReviewForm.ts
View file

@ -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 {

2
UI/SpecialVisualizations.ts
View file

@ -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)
},