Merge branch 'develop' of github.com:pietervdvn/MapComplete into develop

This commit is contained in:
Pieter Vander Vennet 2022-02-16 02:31:39 +01:00
commit bf05a88afd
7 changed files with 75 additions and 353 deletions

View file

@ -8,20 +8,12 @@ import Link from "../Base/Link";
import Toggle from "../Input/Toggle";
import Img from "../Base/Img";
import MapState from "../../Logic/State/MapState";
import {LoginToggle} from "../Popup/LoginButton";
export default class UserBadge extends Toggle {
export default class UserBadge extends LoginToggle {
constructor(state: MapState) {
const userDetails = state.osmConnection.userDetails;
const loginButton = Translations.t.general.loginWithOpenStreetMap
.Clone()
.SetClass("userbadge-login inline-flex justify-center items-center w-full h-full text-lg font-bold min-w-[20em]")
.onClick(() => state.osmConnection.AttemptLogin());
const logout =
Svg.logout_svg()
.onClick(() => {
@ -126,16 +118,14 @@ export default class UserBadge extends Toggle {
}
}));
userBadge.SetClass("inline-block m-0 w-full").SetStyle("pointer-events: all")
super(
userBadge,
loginButton,
state.osmConnection.isLoggedIn
new Combine([userBadge.SetClass("inline-block m-0 w-full").SetStyle("pointer-events: all")])
.SetClass("shadow rounded-full h-min overflow-hidden block w-full md:w-max"),
Translations.t.general.loginWithOpenStreetMap,
state
)
this.SetClass("shadow rounded-full h-min overflow-hidden block w-full md:w-max")
}

View file

@ -18,8 +18,7 @@ import Table from "../Base/Table";
import LeftIndex from "../Base/LeftIndex";
import Toggleable, {Accordeon} from "../Base/Toggleable";
import TableOfContents from "../Base/TableOfContents";
import LoginButton from "../Popup/LoginButton";
import BackToIndex from "../BigComponents/BackToIndex";
import {LoginToggle} from "../Popup/LoginButton";
import {QueryParameters} from "../../Logic/Web/QueryParameters";
interface NoteProperties {
@ -89,7 +88,7 @@ class MassAction extends Combine {
},
shown:"On every open note, read the 'note='-tag and and this note as comment. (This action ignores the textfield)"
},//*/
])
const handledNotesCounter = new UIEventSource<number>(undefined)
@ -127,7 +126,7 @@ class MassAction extends Combine {
handledNotesCounter.map(s => s === undefined)
)
, new VariableUiElement(textField.GetValue().map(txt => "Type a text of at least 15 characters to apply the action. Currently, there are "+(txt?.length ?? 0)+" characters")).SetClass("alert"),
, new VariableUiElement(textField.GetValue().map(txt => "Type a text of at least 15 characters to apply the action. Currently, there are " + (txt?.length ?? 0) + " characters")).SetClass("alert"),
actions.GetValue().map(v => v !== undefined && textField.GetValue()?.data?.length > 15, [textField.GetValue()])
),
new Toggle(
@ -212,7 +211,7 @@ class ImportInspector extends VariableUiElement {
constructor(userDetails: { uid: number } | { display_name: string, search?: string }, state: UserRelatedState) {
let url;
if (userDetails["uid"] !== undefined) {
url = "https://api.openstreetmap.org/api/0.6/notes/search.json?user=" + userDetails["uid"] + "&closed=730&limit=10000&sort=created_at&q=%23import"
} else {
@ -303,28 +302,23 @@ class ImportInspector extends VariableUiElement {
}
}
class ImportViewerGui extends Combine {
class ImportViewerGui extends LoginToggle {
constructor() {
const state = new UserRelatedState(undefined)
const displayNameParam = QueryParameters.GetQueryParameter("user", "", "The username of the person whom you want to see the notes for");
const searchParam = QueryParameters.GetQueryParameter("search", "", "A text that should be included in the first comment of the note to be shown")
super([
super(
new VariableUiElement(state.osmConnection.userDetails.map(ud => {
const display_name = displayNameParam.data;
const search = searchParam.data;
if (display_name !== "" && search !== "") {
return new ImportInspector({display_name, search}, undefined);
}
if (ud === undefined || ud.loggedIn === false) {
return new Combine([new LoginButton("Login to inspect your import flows", state),
new BackToIndex()
])
}
return new ImportInspector(ud, state);
}, [displayNameParam, searchParam]))
]);
}, [displayNameParam, searchParam])),
"Login to inspect your import flows", state
)
}
}

View file

@ -3,13 +3,16 @@ import BaseUIElement from "../BaseUIElement";
import Svg from "../../Svg";
import {OsmConnection} from "../../Logic/Osm/OsmConnection";
import Toggle from "../Input/Toggle";
import {VariableUiElement} from "../Base/VariableUIElement";
import Loading from "../Base/Loading";
import Translations from "../i18n/Translations";
export default class LoginButton extends SubtleButton {
class LoginButton extends SubtleButton {
constructor(text: BaseUIElement | string, state: {
osmConnection: OsmConnection
}) {
super(Svg.osm_logo_ui(), text);
}, icon?: BaseUIElement | string) {
super(icon ?? Svg.osm_logo_ui(), text);
this.onClick(() => {
state.osmConnection.AttemptLogin()
})
@ -17,10 +20,28 @@ export default class LoginButton extends SubtleButton {
}
export class LoginToggle extends Toggle {
export class LoginToggle extends VariableUiElement {
constructor(el, text: BaseUIElement | string, state: {
osmConnection: OsmConnection
}) {
super(el, new LoginButton(text, state), state.osmConnection.isLoggedIn)
const loading = new Loading("Trying to log in...")
const login = new LoginButton(text, state)
super(
state.osmConnection.loadingStatus.map(osmConnectionState => {
console.trace("Current osm state is ", osmConnectionState)
if(osmConnectionState === "loading"){
return loading
}
if(osmConnectionState === "not-attempted"){
return login
}
if(osmConnectionState === "logged-in"){
return el
}
// Error!
return new LoginButton(Translations.t.general.loginFailed, state, Svg.invalid_svg())
})
)
}
}