Fix typescript warnings

This commit is contained in:
wjtje 2023-02-03 15:13:05 +01:00 committed by Pieter Vander Vennet
parent b1b4e6acba
commit 8743fa6192
2 changed files with 55 additions and 48 deletions

View file

@ -1,44 +1,45 @@
<script lang="ts"> <script lang="ts">
import { Store, UIEventSource } from "../../Logic/UIEventSource"; import { Store, UIEventSource } from "../../Logic/UIEventSource"
import { Tiles } from "../../Models/TileRange"; import { Tiles } from "../../Models/TileRange"
import { Utils } from "../../Utils"; import { Utils } from "../../Utils"
import global_community from "../../assets/community_index_global_resources.json"; import global_community from "../../assets/community_index_global_resources.json"
import ContactLink from "./ContactLink.svelte"; import ContactLink from "./ContactLink.svelte"
import { GeoOperations } from "../../Logic/GeoOperations"; import { GeoOperations } from "../../Logic/GeoOperations"
import Translations from "../i18n/Translations"; import Translations from "../i18n/Translations"
import ToSvelte from "../Base/ToSvelte.svelte"; import ToSvelte from "../Base/ToSvelte.svelte"
import { ImmutableStore } from "../../Logic/UIEventSource.js"; import { Feature, Geometry, GeometryCollection } from "@turf/turf"
export let locationControl: Store<{ lat: number, lon: number }>; export let locationControl: Store<{ lat: number; lon: number }>
const tileToFetch: Store<string> = locationControl.mapD(l => { const tileToFetch: Store<string> = locationControl.mapD((l) => {
const t = Tiles.embedded_tile(l.lat, l.lon, 6); const t = Tiles.embedded_tile(l.lat, l.lon, 6)
return `https://raw.githubusercontent.com/pietervdvn/MapComplete-data/main/community_index/tile_${t.z}_${t.x}_${t.y}.geojson`; return `https://raw.githubusercontent.com/pietervdvn/MapComplete-data/main/community_index/tile_${t.z}_${t.x}_${t.y}.geojson`
}); })
const t = Translations.t.communityIndex const t = Translations.t.communityIndex
const resources = new UIEventSource<[]>([]); const resources = new UIEventSource<
Feature<Geometry | GeometryCollection, { resources; nameEn: string }>[]
>([])
tileToFetch.addCallbackAndRun(async url => { tileToFetch.addCallbackAndRun(async (url) => {
const data = await Utils.downloadJsonCached(url, 24 * 60 * 60); const data = await Utils.downloadJsonCached(url, 24 * 60 * 60)
if (data === undefined) { if (data === undefined) {
return; return
}
resources.setData(data.features);
} }
); resources.setData(data.features)
})
const filteredResources = resources.map(features => features.filter(f => {
return GeoOperations.inside([locationControl.data.lon, locationControl.data.lat], f)
}),
[locationControl]);
const filteredResources = resources.map(
(features) =>
features.filter((f) => {
return GeoOperations.inside([locationControl.data.lon, locationControl.data.lat], f)
}),
[locationControl]
)
</script> </script>
<div> <div>
<ToSvelte construct={t.intro} /> <ToSvelte construct={t.intro} />
{#each $filteredResources as feature} {#each $filteredResources as feature}
<ContactLink country={feature.properties} /> <ContactLink country={feature.properties} />
{/each} {/each}
<ContactLink country={{resources:global_community, nameEn: "Global resources"}} /> <ContactLink country={{ resources: global_community, nameEn: "Global resources" }} />
</div> </div>

View file

@ -1,20 +1,27 @@
<script lang="ts"> <script lang="ts">
// A contact link indicates how a mapper can contact their local community // A contact link indicates how a mapper can contact their local community
// The _properties_ of a community feature // The _properties_ of a community feature
import Locale from "../i18n/Locale.js"; import Locale from "../i18n/Locale.js"
import Translations from "../i18n/Translations"; import Translations from "../i18n/Translations"
import ToSvelte from "../Base/ToSvelte.svelte"; import ToSvelte from "../Base/ToSvelte.svelte"
import * as native from "../../assets/language_native.json"; import * as native from "../../assets/language_native.json"
import { TypedTranslation } from "../i18n/Translation"; import { TypedTranslation } from "../i18n/Translation"
const availableTranslationTyped: TypedTranslation<{ native: string }> = Translations.t.communityIndex.available; const availableTranslationTyped: TypedTranslation<{ native: string }> =
const availableTranslation = availableTranslationTyped.OnEveryLanguage((s, ln) => s.replace("{native}", native[ln] ?? ln)); Translations.t.communityIndex.available
export let country: { resources; nameEn: string }; const availableTranslation = availableTranslationTyped.OnEveryLanguage((s, ln) =>
let resources: { id: string, resolved: Record<string, string>, languageCodes: string[] }[] = [] s.replace("{native}", native[ln] ?? ln)
$: resources = Array.from(Object.values(country?.resources ?? {})); )
export let country: { resources; nameEn: string }
const language = Locale.language; let resources: {
id: string
resolved: Record<string, string>
languageCodes: string[]
type: string
}[] = []
$: resources = Array.from(Object.values(country?.resources ?? {}))
const language = Locale.language
</script> </script>
<div> <div>
@ -26,20 +33,19 @@
<img <img
class="w-8 h-8 m-2" class="w-8 h-8 m-2"
src={"https://raw.githubusercontent.com/osmlab/osm-community-index/main/dist/img/" + src={"https://raw.githubusercontent.com/osmlab/osm-community-index/main/dist/img/" +
resource.type + resource.type +
".svg"} ".svg"}
/> />
<div class="flex flex-col"> <div class="flex flex-col">
<a href={resource.resolved.url} target="_blank" rel="noreferrer nofollow" class="font-bold"> <a href={resource.resolved.url} target="_blank" rel="noreferrer nofollow" class="font-bold">
{resource.resolved.name ?? resource.resolved.url} {resource.resolved.name ?? resource.resolved.url}
</a> </a>
{resource.resolved?.description} {resource.resolved?.description}
{#if (resource.languageCodes?.indexOf($language) >= 0)} {#if resource.languageCodes?.indexOf($language) >= 0}
<span class="border-2 rounded-full border-lime-500 text-sm w-fit px-2"> <span class="border-2 rounded-full border-lime-500 text-sm w-fit px-2">
<ToSvelte construct={() => availableTranslation.Clone()} /> <ToSvelte construct={() => availableTranslation.Clone()} />
</span> </span>
{/if} {/if}
</div> </div>
</div> </div>
{/each} {/each}