Add more checks in the import helper after user testing

UI/ImportFlow/AskMetadata.ts

@@ -9,6 +9,14 @@ import {DropDown} from "../Input/DropDown";
 import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
 import BaseUIElement from "../BaseUIElement";
 import {FixedUiElement} from "../Base/FixedUiElement";
+import {RadioButton} from "../Input/RadioButton";
+import {FixedInputElement} from "../Input/FixedInputElement";
+import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
+import {InputElement} from "../Input/InputElement";
+import Img from "../Base/Img";
+import {VariableUiElement} from "../Base/VariableUIElement";
+import {And} from "../../Logic/Tags/And";
+import Toggleable from "../Base/Toggleable";
 
 export class AskMetadata extends Combine implements FlowStep<{
     features: any[],
@@ -27,14 +35,14 @@ export class AskMetadata extends Combine implements FlowStep<{
     }>;
     public readonly IsValid: UIEventSource<boolean>;
 
-    constructor(params: ({ features: any[], layer: LayerConfig })) {
+    constructor(params: ({ features: any[], theme: string })) {
 
         const introduction = ValidatedTextField.ForType("text").ConstructInputElement({
             value: LocalStorageSource.Get("import-helper-introduction-text"),
             inputStyle: "width: 100%"
         })
 
-        const wikilink = ValidatedTextField.ForType("string").ConstructInputElement({
+        const wikilink = ValidatedTextField.ForType("url").ConstructInputElement({
             value: LocalStorageSource.Get("import-helper-wikilink-text"),
             inputStyle: "width: 100%"
         })
@@ -44,26 +52,6 @@ export class AskMetadata extends Combine implements FlowStep<{
             inputStyle: "width: 100%"
         })
 
-        let options: { value: string, shown: BaseUIElement }[] = AllKnownLayouts.layoutsList
-            .filter(th => th.layers.some(l => l.id === params.layer.id))
-            .filter(th => th.id !== "personal")
-            .map(th => ({
-                value: th.id,
-                shown: th.title
-            }))
-
-        options.splice(0, 0, {
-            shown: new FixedUiElement("Select a theme"),
-            value: undefined
-        })
-
-        const theme = new DropDown("Which theme should be linked in the note?", options)
-
-        ValidatedTextField.ForType("string").ConstructInputElement({
-            value: LocalStorageSource.Get("import-helper-theme-text"),
-            inputStyle: "width: 100%"
-        })
-
         super([
             new Title("Set metadata"),
             "Before adding " + params.features.length + " notes, please provide some extra information.",
@@ -73,7 +61,20 @@ export class AskMetadata extends Combine implements FlowStep<{
             source.SetClass("w-full border border-black"),
             "On what wikipage can one find more information about this import?",
             wikilink.SetClass("w-full border border-black"),
-            theme
+            new VariableUiElement(wikilink.GetValue().map(wikilink => {
+                try{
+                    const url = new URL(wikilink)
+                    if(url.hostname.toLowerCase() !== "wiki.openstreetmap.org"){
+                        return new FixedUiElement("Expected a link to wiki.openstreetmap.org").SetClass("alert");
+                    }
+
+                    if(url.pathname.toLowerCase() === "/wiki/main_page"){
+                        return new FixedUiElement("Nope, the home page isn't allowed either. Enter the URL of a proper wikipage documenting your import").SetClass("alert");
+                    }
+                }catch(e){
+                    return new FixedUiElement("Not a valid URL").SetClass("alert")
+                }
+            }))
         ]);
         this.SetClass("flex flex-col")
 
@@ -83,16 +84,30 @@ export class AskMetadata extends Combine implements FlowStep<{
                 wikilink: wikilink.GetValue().data,
                 intro,
                 source: source.GetValue().data,
-                theme: theme.GetValue().data
-
+                theme: params.theme
             }
-        }, [wikilink.GetValue(), source.GetValue(), theme.GetValue()])
+        }, [wikilink.GetValue(), source.GetValue()])
 
         this.IsValid = this.Value.map(obj => {
             if (obj === undefined) {
                 return false;
             }
-            return obj.theme !== undefined && obj.features !== undefined && obj.wikilink !== undefined && obj.intro !== undefined && obj.source !== undefined;
+            if ([ obj.features, obj.intro, obj.wikilink, obj.source].some(v => v === undefined)){
+                console.log("Obj is", obj)
+                return false;
+            }
+            
+            try{
+                const url = new URL(obj.wikilink)
+                if(url.hostname.toLowerCase() !== "wiki.openstreetmap.org"){
+                    return false;
+                }
+            }catch(e){
+                return false
+            }
+            
+            return true;
+                
         })
     }