App redesign (#2946)

* Start of app redesign

* format

* continue progress

* Content page nearly done

* Fix recursion issues with content page

* Fix update all alignment

* Discover page progress

* Settings progress

* Removed unlocked-size hack that breaks web

* Revamp project page, refactor web project page to share code with app, fixed loading bar, misc UI/UX enhancements, update ko-fi logo, update arrow icons, fix web issues caused by floating-vue migration, fix tooltip issues, update web tooltips, clean up web hydration issues

* Ads + run prettier

* Begin auth refactor, move common messages to ui lib, add i18n extraction to all apps, begin Library refactor

* fix ads not hiding when plus log in

* rev lockfile changes/conflicts

* Fix sign in page

* Add generated

* (mostly) Data driven search

* Fix search mobile issue

* profile fixes

* Project versions page, fix typescript on UI lib and misc fixes

* Remove unused gallery component

* Fix linkfunction err

* Search filter controls at top, localization for locked filters

* Fix provided filter names

* Fix navigating from instance browse to main browse

* Friends frontend (#2995)

* Friends system frontend

* (almost) finish frontend

* finish friends, fix lint

* Fix lint

---------

Signed-off-by: Geometrically <18202329+Geometrically@users.noreply.github.com>

* Refresh macOS app icon

* Update web search UI more

* Fix link opens

* Fix frontend build

---------

Signed-off-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
Co-authored-by: Jai A <jaiagr+gpg@pm.me>
Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
This commit is contained in:
Prospector
2024-12-11 19:54:18 -08:00
committed by GitHub
parent 6ec1dcf088
commit c39bb78e38
257 changed files with 15713 additions and 9475 deletions

View File

@@ -1,249 +0,0 @@
export const BASE62_CHARS = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'
type Base62Char = (typeof BASE62_CHARS)[number]
export function formatPrice(locale: string, price: number, currency: string): string
export function getCurrency(userCountry: string): string
declare global {
type ModrinthId = `${Base62Char}`[]
type Environment = 'required' | 'optional' | 'unsupported' | 'unknown'
type RequestableStatus = 'approved' | 'archived' | 'unlisted' | 'private'
type ApprovedStatus = RequestableStatus | 'scheduled'
type UnapprovedStatus = 'draft' | 'processing' | 'rejected' | 'withheld'
type ProjectStatus = ApprovedStatus | UnapprovedStatus | 'unknown'
type DonationPlatform =
| { short: 'patreon'; name: 'Patreon' }
| { short: 'bmac'; name: 'Buy Me A Coffee' }
| { short: 'paypal'; name: 'PayPal' }
| { short: 'github'; name: 'GitHub Sponsors' }
| { short: 'ko-fi'; name: 'Ko-fi' }
| { short: 'other'; name: 'Other' }
type ProjectType = 'mod' | 'modpack' | 'resourcepack' | 'shader'
type MonetizationStatus = 'monetized' | 'demonetized' | 'force-demonetized'
type GameVersion = string
type Platform = string
type Category = string
type CategoryOrPlatform = Category | Platform
interface DonationLink<T extends DonationPlatform> {
id: T['short']
platform: T['name']
url: string
}
interface GalleryImage {
url: string
featured: boolean
created: string
ordering: number
title?: string
description?: string
}
interface Project {
id: ModrinthId
project_type: ProjectType
slug: string
title: string
description: string
status: ProjectStatus
requested_status: RequestableStatus
monetization_status: MonetizationStatus
body: string
icon_url?: string
color?: number
categories: Category[]
additional_categories: Category[]
downloads: number
followers: number
client_side: Environment
server_side: Environment
team: ModrinthId
thread_id: ModrinthId
issues_url?: string
source_url?: string
wiki_url?: string
discord_url?: string
donation_urls: DonationLink[]
published: string
updated: string
approved: string
queued: string
game_versions: GameVersion[]
loaders: Platform[]
versions: ModrinthId[]
gallery?: GalleryImage[]
license: {
id: string
name
string
url?: string
}
}
interface SearchResult {
id: ModrinthId
project_type: ProjectType
slug: string
title: string
description: string
monetization_status: MonetizationStatus
icon_url?: string
color?: number
categories: CategoryOrPlatform[]
display_categories: CategoryOrPlatform[]
versions: GameVersion[]
latest_version: GameVersion
downloads: number
follows: number
client_side: Environment
server_side: Environment
author: string
date_created: string
date_modified: string
gallery: string[]
featured_gallery?: string[]
license: string
}
type DependencyType = 'required' | 'optional' | 'incompatible' | 'embedded'
interface VersionDependency {
dependency_type: DependencyType
file_name?: string
}
interface ProjectDependency {
dependency_type: DependencyType
project_id?: string
}
interface FileDependency {
dependency_type: DependencyType
file_name?: string
}
type Dependency = VersionDependency | ProjectDependency | FileDependency
type VersionChannel = 'release' | 'beta' | 'alpha'
type VersionStatus = 'listed' | 'archived' | 'draft' | 'unlisted' | 'scheduled' | 'unknown'
type FileType = 'required-resource-pack' | 'optional-resource-pack'
interface VersionFileHash {
sha512: string
sha1: string
}
interface VersionFile {
hashes: VersionFileHash[]
url: string
filename: string
primary: boolean
size: number
file_type?: FileType
}
interface Version {
name: string
version_number: string
changelog?: string
dependencies: Dependency[]
game_versions: GameVersion[]
version_type: VersionChannel
loaders: Platform[]
featured: boolean
status: VersionStatus
id: ModrinthId
project_id: ModrinthId
author_id: ModrinthId
date_published: string
downloads: number
files: VersionFile[]
}
interface PayoutData {
balance: number
payout_wallet: 'paypal' | 'venmo'
payout_wallet_type: 'email' | 'phone' | 'user_handle'
payout_address: string
}
type UserRole = 'admin' | 'moderator' | 'pyro' | 'developer'
enum UserBadge {
MIDAS = 1 << 0,
EARLY_MODPACK_ADOPTER = 1 << 1,
EARLY_RESPACK_ADOPTER = 1 << 2,
EARLY_PLUGIN_ADOPTER = 1 << 3,
ALPHA_TESTER = 1 << 4,
CONTRIBUTOR = 1 << 5,
TRANSLATOR = 1 << 6,
}
type UserBadges = number
interface User {
username: string
email?: string
bio?: string
payout_data?: PayoutData
id: ModrinthId
avatar_url: string
created: string
role: UserRole
badges: UserBadges
auth_providers?: string[]
email_verified?: boolean
has_password?: boolean
has_totp?: boolean
}
enum TeamMemberPermission {
UPLOAD_VERSION = 1 << 0,
DELETE_VERSION = 1 << 1,
EDIT_DETAILS = 1 << 2,
EDIT_BODY = 1 << 3,
MANAGE_INVITES = 1 << 4,
REMOVE_MEMBER = 1 << 5,
EDIT_MEMBER = 1 << 6,
DELETE_PROJECT = 1 << 7,
VIEW_ANALYTICS = 1 << 8,
VIEW_PAYOUTS = 1 << 9,
}
type TeamMemberPermissions = number
interface TeamMember {
team_id: ModrinthId
user: User
role: string
permissions: TeamMemberPermissions
accepted: boolean
payouts_split: number
ordering: number
}
}

View File

@@ -4,3 +4,5 @@ export * from './projects'
export * from './users'
export * from './utils'
export * from './billing'
export * from './types'

View File

@@ -1,74 +1,5 @@
// noinspection JSUnusedGlobalSymbols
export const getProjectTypeForDisplay = (type, categories, tags) => {
if (type === 'mod') {
const isPlugin = categories.some((category) => {
return tags.loaderData.allPluginLoaders.includes(category)
})
const isMod = categories.some((category) => {
return tags.loaderData.modLoaders.includes(category)
})
const isDataPack = categories.some((category) => {
return tags.loaderData.dataPackLoaders.includes(category)
})
if (isMod && isPlugin && isDataPack) {
return 'mod, plugin, and data pack'
} else if (isMod && isPlugin) {
return 'mod and plugin'
} else if (isMod && isDataPack) {
return 'mod and data pack'
} else if (isPlugin && isDataPack) {
return 'plugin and data pack'
} else if (isDataPack) {
return 'data pack'
} else if (isPlugin) {
return 'plugin'
}
}
return type
}
export const getProjectTypeForUrl = (type, loaders, tags) => {
if (type === 'mod') {
const isMod = loaders.some((category) => {
return tags.loaderData.modLoaders.includes(category)
})
const isPlugin = loaders.some((category) => {
return tags.loaderData.allPluginLoaders.includes(category)
})
const isDataPack = loaders.some((category) => {
return tags.loaderData.dataPackLoaders.includes(category)
})
if (isDataPack) {
return 'datapack'
} else if (isPlugin) {
return 'plugin'
} else if (isMod) {
return 'mod'
}
return 'mod'
}
return type
}
export const getProjectLink = (project) => {
return `/${getProjectTypeForUrl(project.project_type, project.loaders)}/${
project.slug ? project.slug : project.id
}`
}
export const getVersionLink = (project, version) => {
if (version) {
return `${getProjectLink(project)}/version/${version.id}`
}
return getProjectLink(project)
}
export const isApproved = (project) => {
return project && APPROVED_PROJECT_STATUSES.includes(project.status)
}
@@ -104,3 +35,201 @@ export const PRIVATE_PROJECT_STATUSES = ['private', 'rejected', 'processing']
export const REJECTED_PROJECT_STATUSES = ['rejected', 'withheld']
export const UNDER_REVIEW_PROJECT_STATUSES = ['processing']
export const DRAFT_PROJECT_STATUSES = ['draft']
export type GameVersionTag = {
version: string
version_type: string
date: string
major: boolean
}
export type DisplayProjectType =
| 'mod'
| 'plugin'
| 'datapack'
| 'resourcepack'
| 'modpack'
| 'shader'
export type PlatformTag = {
icon: string
name: string
supported_project_types: DisplayProjectType[]
}
export function getVersionsToDisplay(project, allGameVersions: GameVersionTag[]) {
return formatVersionsForDisplay(project.game_versions.slice(), allGameVersions)
}
export function formatVersionsForDisplay(
gameVersions: string[],
allGameVersions: GameVersionTag[],
) {
const inputVersions = gameVersions.slice()
const allVersions = allGameVersions.slice()
const allSnapshots = allVersions.filter((version) => version.version_type === 'snapshot')
const allReleases = allVersions.filter((version) => version.version_type === 'release')
const allLegacy = allVersions.filter(
(version) => version.version_type !== 'snapshot' && version.version_type !== 'release',
)
{
const indices = allVersions.reduce((map, gameVersion, index) => {
map[gameVersion.version] = index
return map
}, {})
inputVersions.sort((a, b) => indices[a] - indices[b])
}
const releaseVersions = inputVersions.filter((projVer) =>
allReleases.some((gameVer) => gameVer.version === projVer),
)
const dateString = allReleases.find((version) => version.version === releaseVersions[0])?.date
const latestReleaseVersionDate = dateString ? Date.parse(dateString) : 0
const latestSnapshot = inputVersions.find((projVer) =>
allSnapshots.some(
(gameVer) =>
gameVer.version === projVer &&
(!latestReleaseVersionDate || latestReleaseVersionDate < Date.parse(gameVer.date)),
),
)
const allReleasesGrouped = groupVersions(
allReleases.map((release) => release.version),
false,
)
const projectVersionsGrouped = groupVersions(releaseVersions, true)
const releaseVersionsAsRanges = projectVersionsGrouped.map(({ major, minor }) => {
if (minor.length === 1) {
return formatMinecraftMinorVersion(major, minor[0])
}
const range = allReleasesGrouped.find((x) => x.major === major)
if (range?.minor.every((value, index) => value === minor[index])) {
return `${major}.x`
}
return `${formatMinecraftMinorVersion(major, minor[0])}${formatMinecraftMinorVersion(major, minor[minor.length - 1])}`
})
const legacyVersionsAsRanges = groupConsecutiveIndices(
inputVersions.filter((projVer) => allLegacy.some((gameVer) => gameVer.version === projVer)),
allLegacy,
)
let output = [...legacyVersionsAsRanges]
// show all snapshots if there's no release versions
if (releaseVersionsAsRanges.length === 0) {
const snapshotVersionsAsRanges = groupConsecutiveIndices(
inputVersions.filter((projVer) =>
allSnapshots.some((gameVer) => gameVer.version === projVer),
),
allSnapshots,
)
output = [...snapshotVersionsAsRanges, ...output]
} else {
output = [...releaseVersionsAsRanges, ...output]
}
if (latestSnapshot && !output.includes(latestSnapshot)) {
output = [latestSnapshot, ...output]
}
return output
}
const mcVersionRegex = /^([0-9]+.[0-9]+)(.[0-9]+)?$/
type VersionRange = {
major: string
minor: number[]
}
function groupVersions(versions: string[], consecutive = false) {
return versions
.slice()
.reverse()
.reduce((ranges: VersionRange[], version: string) => {
const matchesVersion = version.match(mcVersionRegex)
if (matchesVersion) {
const majorVersion = matchesVersion[1]
const minorVersion = matchesVersion[2]
const minorNumeric = minorVersion ? parseInt(minorVersion.replace('.', '')) : 0
const prevInRange = ranges.find(
(x) => x.major === majorVersion && (!consecutive || x.minor.at(-1) === minorNumeric - 1),
)
if (prevInRange) {
prevInRange.minor.push(minorNumeric)
return ranges
}
return [...ranges, { major: majorVersion, minor: [minorNumeric] }]
}
return ranges
}, [])
.reverse()
}
function groupConsecutiveIndices(versions: string[], referenceList: GameVersionTag[]) {
if (!versions || versions.length === 0) {
return []
}
const referenceMap = new Map()
referenceList.forEach((item, index) => {
referenceMap.set(item.version, index)
})
const sortedList: string[] = versions
.slice()
.sort((a, b) => referenceMap.get(a) - referenceMap.get(b))
const ranges: string[] = []
let start = sortedList[0]
let previous = sortedList[0]
for (let i = 1; i < sortedList.length; i++) {
const current = sortedList[i]
if (referenceMap.get(current) !== referenceMap.get(previous) + 1) {
ranges.push(validateRange(`${previous}${start}`))
start = current
}
previous = current
}
ranges.push(validateRange(`${previous}${start}`))
return ranges
}
function validateRange(range: string): string {
switch (range) {
case 'rd-132211b1.8.1':
return 'All legacy versions'
case 'a1.0.4b1.8.1':
return 'All alpha and beta versions'
case 'a1.0.4a1.2.6':
return 'All alpha versions'
case 'b1.0b1.8.1':
return 'All beta versions'
case 'rd-132211inf20100618':
return 'All pre-alpha versions'
}
const splitRange = range.split('')
if (splitRange && splitRange[0] === splitRange[1]) {
return splitRange[0]
}
return range
}
function formatMinecraftMinorVersion(major: string, minor: number): string {
return minor === 0 ? major : `${major}.${minor}`
}

243
packages/utils/types.ts Normal file
View File

@@ -0,0 +1,243 @@
export const BASE62_CHARS = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'
export type Base62Char = (typeof BASE62_CHARS)[number]
export type ModrinthId = `${Base62Char}`[]
export type Environment = 'required' | 'optional' | 'unsupported' | 'unknown'
export type RequestableStatus = 'approved' | 'archived' | 'unlisted' | 'private'
export type ApprovedStatus = RequestableStatus | 'scheduled'
export type UnapprovedStatus = 'draft' | 'processing' | 'rejected' | 'withheld'
export type ProjectStatus = ApprovedStatus | UnapprovedStatus | 'unknown'
export type DonationPlatform =
| { short: 'patreon'; name: 'Patreon' }
| { short: 'bmac'; name: 'Buy Me A Coffee' }
| { short: 'paypal'; name: 'PayPal' }
| { short: 'github'; name: 'GitHub Sponsors' }
| { short: 'ko-fi'; name: 'Ko-fi' }
| { short: 'other'; name: 'Other' }
export type ProjectType = 'mod' | 'modpack' | 'resourcepack' | 'shader'
export type MonetizationStatus = 'monetized' | 'demonetized' | 'force-demonetized'
export type GameVersion = string
export type Platform = string
export type Category = string
export type CategoryOrPlatform = Category | Platform
export interface DonationLink<T extends DonationPlatform> {
id: T['short']
platform: T['name']
url: string
}
export interface GalleryImage {
url: string
featured: boolean
created: string
ordering: number
title?: string
description?: string
}
export interface Project {
id: ModrinthId
project_type: ProjectType
slug: string
title: string
description: string
status: ProjectStatus
requested_status: RequestableStatus
monetization_status: MonetizationStatus
body: string
icon_url?: string
color?: number
categories: Category[]
additional_categories: Category[]
downloads: number
followers: number
client_side: Environment
server_side: Environment
team: ModrinthId
thread_id: ModrinthId
issues_url?: string
source_url?: string
wiki_url?: string
discord_url?: string
donation_urls: DonationLink<DonationPlatform>[]
published: string
updated: string
approved: string
queued: string
game_versions: GameVersion[]
loaders: Platform[]
versions: ModrinthId[]
gallery?: GalleryImage[]
license: {
id: string
name
string
url?: string
}
}
export interface SearchResult {
id: ModrinthId
project_type: ProjectType
slug: string
title: string
description: string
monetization_status: MonetizationStatus
icon_url?: string
color?: number
categories: CategoryOrPlatform[]
display_categories: CategoryOrPlatform[]
versions: GameVersion[]
latest_version: GameVersion
downloads: number
follows: number
client_side: Environment
server_side: Environment
author: string
date_created: string
date_modified: string
gallery: string[]
featured_gallery?: string[]
license: string
}
export type DependencyType = 'required' | 'optional' | 'incompatible' | 'embedded'
export interface VersionDependency {
dependency_type: DependencyType
file_name?: string
}
export interface ProjectDependency {
dependency_type: DependencyType
project_id?: string
}
export interface FileDependency {
dependency_type: DependencyType
file_name?: string
}
export type Dependency = VersionDependency | ProjectDependency | FileDependency
export type VersionChannel = 'release' | 'beta' | 'alpha'
export type VersionStatus = 'listed' | 'archived' | 'draft' | 'unlisted' | 'scheduled' | 'unknown'
export type FileType = 'required-resource-pack' | 'optional-resource-pack'
export interface VersionFileHash {
sha512: string
sha1: string
}
export interface VersionFile {
hashes: VersionFileHash[]
url: string
filename: string
primary: boolean
size: number
file_type?: FileType
}
export interface Version {
name: string
version_number: string
changelog?: string
dependencies: Dependency[]
game_versions: GameVersion[]
version_type: VersionChannel
loaders: Platform[]
featured: boolean
status: VersionStatus
id: ModrinthId
project_id: ModrinthId
author_id: ModrinthId
date_published: string
downloads: number
files: VersionFile[]
}
export interface PayoutData {
balance: number
payout_wallet: 'paypal' | 'venmo'
payout_wallet_type: 'email' | 'phone' | 'user_handle'
payout_address: string
}
export type UserRole = 'admin' | 'moderator' | 'pyro' | 'developer'
export enum UserBadge {
MIDAS = 1 << 0,
EARLY_MODPACK_ADOPTER = 1 << 1,
EARLY_RESPACK_ADOPTER = 1 << 2,
EARLY_PLUGIN_ADOPTER = 1 << 3,
ALPHA_TESTER = 1 << 4,
CONTRIBUTOR = 1 << 5,
TRANSLATOR = 1 << 6,
}
export type UserBadges = number
export interface User {
username: string
email?: string
bio?: string
payout_data?: PayoutData
id: ModrinthId
avatar_url: string
created: string
role: UserRole
badges: UserBadges
auth_providers?: string[]
email_verified?: boolean
has_password?: boolean
has_totp?: boolean
}
export enum TeamMemberPermission {
UPLOAD_VERSION = 1 << 0,
DELETE_VERSION = 1 << 1,
EDIT_DETAILS = 1 << 2,
EDIT_BODY = 1 << 3,
MANAGE_INVITES = 1 << 4,
REMOVE_MEMBER = 1 << 5,
EDIT_MEMBER = 1 << 6,
DELETE_PROJECT = 1 << 7,
VIEW_ANALYTICS = 1 << 8,
VIEW_PAYOUTS = 1 << 9,
}
export type TeamMemberPermissions = number
export interface TeamMember {
team_id: ModrinthId
user: User
role: string
permissions: TeamMemberPermissions
accepted: boolean
payouts_split: number
ordering: number
}

View File

@@ -296,3 +296,37 @@ export const acceptFileFromProjectType = (projectType) => {
return '*'
}
}
// Sorts alphabetically, but correctly identifies 8x, 128x, 256x, etc
// identifier[0], then if it ties, identifier[1], etc
export const sortByNameOrNumber = (sortable, identifiers) => {
sortable.sort((a, b) => {
for (const identifier of identifiers) {
const aNum = parseFloat(a[identifier])
const bNum = parseFloat(b[identifier])
if (isNaN(aNum) && isNaN(bNum)) {
// Both are strings, sort alphabetically
const stringComp = a[identifier].localeCompare(b[identifier])
if (stringComp != 0) return stringComp
} else if (!isNaN(aNum) && !isNaN(bNum)) {
// Both are numbers, sort numerically
const numComp = aNum - bNum
if (numComp != 0) return numComp
} else {
// One is a number and one is a string, numbers go first
const numStringComp = isNaN(aNum) ? 1 : -1
if (numStringComp != 0) return numStringComp
}
}
return 0
})
return sortable
}
export const getArrayOrString = (x: string[] | string): string[] => {
if (typeof x === 'string') {
return [x]
} else {
return x
}
}