akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-24 15:47:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve homepage (#245)

Browse Source 
* Improve how generators are listed on home

* Add some icons for generators

* Remove debug

* Refactor cachedFetch and use generated changelogs

* Add limit to how many changes are shown by default

* Add more generator icons

* Refactor cards

* Fix generator icons for light theme

* Add more worldgen icons

* Add remaining generator icons

* Refactor navigation and badges style

* Group on homepage for guides and tools

* Fix header button style

* Add versions and technical changelog to homepage

* Make it clear that not all changes could be documented
This commit is contained in:
Misode
2022-07-01 23:48:38 +02:00
committed by GitHub
parent 29031bb375
commit d0bae089d1
40 changed files with 791 additions and 460 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/app/components/versions/VersionList.tsx
View File

@@ -1,39 +1,43 @@
import { useMemo, useState } from 'preact/hooks'
import type { ComponentChildren } from 'preact'
import { useMemo } from 'preact/hooks'
import { useLocale } from '../../contexts/index.js'
import { useSearchParam } from '../../hooks/index.js'
import { useLocalStorage, useSearchParam } from '../../hooks/index.js'
import type { VersionMeta } from '../../services/index.js'
import { Checkbox, TextInput } from '../index.js'
import { VersionEntry } from './VersionEntry.js'
const INCLUDE_SNAPSHOTS = 'misode_include_snapshots'
const SEARCH_KEY = 'search'
interface Props {
versions: VersionMeta[]
link?: (id: string) => string
versions?: VersionMeta[],
link?: (id: string) => string,
navigation?: ComponentChildren,
}
export function VersionList({ versions, link }: Props) {
export function VersionList({ versions, link, navigation }: Props) {
const { locale } = useLocale()
const [snapshots, setSnapshots] = useState(true)
const [snapshots, setSnapshots] = useLocalStorage(INCLUDE_SNAPSHOTS, true, v => v === 'true', b => `${b}`)
const [search, setSearch] = useSearchParam(SEARCH_KEY)
const filteredVersions = useMemo(() => versions.filter(v => {
const filteredVersions = useMemo(() => versions?.filter(v => {
if (v.type === 'snapshot' && !snapshots) return false
return v.id.includes(search ?? '')
}), [versions, snapshots, search])
return <>
<div class="versions-controls">
<TextInput class="btn btn-input version-search" placeholder={locale('versions.search')}
<div class="navigation">
{navigation}
<TextInput class="btn btn-input query-search" placeholder={locale('versions.search')}
value={search} onChange={setSearch} />
<Checkbox label="Include snapshots" value={snapshots} onChange={setSnapshots} />
</div>
<div class="version-list">
{filteredVersions.map(v => <VersionEntry version={v} link={link?.(v.id)} />)}
{filteredVersions.length === 0 && <span>
{locale('versions.no_results')}
</span>}
{filteredVersions === undefined
? <span class="note">{locale('loading')}</span>
: filteredVersions.length === 0
? <span class="note">{locale('versions.no_results')}</span>
: filteredVersions.map(v => <VersionEntry version={v} link={link?.(v.id)} />)}
</div>
</>
}