antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-12 23:36:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix types - components/templates (#172)

Browse Source 
Fix more types - specifically in components/templates. This is done by
removing eslint-ignores and fixing them.
This commit is contained in:
Ulf Gebhardt 2025-03-03 20:58:04 +01:00 committed by GitHub
parent 4041e9472a
commit 5c18ed2abd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 23 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/Components/Templates/DateUserInfo.tsx
View File

@ -1,6 +1,3 @@
/* eslint-disable @typescript-eslint/no-non-null-assertion */
/* eslint-disable @typescript-eslint/no-unnecessary-condition */
/* eslint-disable @typescript-eslint/prefer-optional-chain */
import { useState } from 'react'
import { timeAgo } from '#utils/TimeAgo'
@ -18,7 +15,8 @@ export const DateUserInfo = ({ item }: { item: Item }) => {
<p
className={'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500'}
onClick={() => setInfoExpanded(false)}
>{`${item.date_updated && item.date_updated !== item.date_created ? 'updated' : 'posted'} ${item && item.user_created && item.user_created.first_name ? `by ${item.user_created.first_name}` : ''} ${item.date_updated ? timeAgo(item.date_updated) : timeAgo(item.date_created!)}`}</p>
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
>{`${item.date_updated && item.date_updated !== item.date_created ? 'updated' : 'posted'} ${item.user_created?.first_name ? `by ${item.user_created.first_name}` : ''} ${item.date_updated ? timeAgo(item.date_updated) : timeAgo(item.date_created!)}`}</p>
) : (
<p
className='!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500'

7
src/Components/Templates/EmojiPicker.tsx
View File

@ -1,4 +1,3 @@
/* eslint-disable @typescript-eslint/restrict-template-expressions */
import { useState } from 'react'
interface Props {
@ -110,7 +109,7 @@ export const EmojiPicker = ({
<button
key={emoji}
onClick={() => selectEmoji(emoji)}
className={`tw-cursor-pointer tw-text-2xl tw-p-2 hover:tw-bg-base-200 tw-rounded-md ${emoji === selectedEmoji && 'tw-bg-base-300'}`}
className={`tw-cursor-pointer tw-text-2xl tw-p-2 hover:tw-bg-base-200 tw-rounded-md ${emoji === selectedEmoji ? 'tw-bg-base-300' : ''}`}
>
{emoji}
</button>
@ -121,7 +120,7 @@ export const EmojiPicker = ({
{shapes.map((shape) => (
<div
key={shape}
className={`tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 ${shape === selectedShape && 'tw-bg-base-300'}`}
className={`tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 ${shape === selectedShape ? 'tw-bg-base-300' : ''}`}
onClick={() => selectShape(shape)}
>
<div className={`tw-h-12 tw-mask tw-mask-${shape} tw-bg-neutral-content`}></div>
@ -133,7 +132,7 @@ export const EmojiPicker = ({
{colors.map((color) => (
<div
key={color}
className={`tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 tw-flex tw-justify-center tw-items-center ${color === selectedColor && 'tw-bg-base-300'}`}
className={`tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 tw-flex tw-justify-center tw-items-center ${color === selectedColor ? 'tw-bg-base-300' : ''}`}
onClick={() => selectColor(color)}
>
<div className={`tw-h-8 tw-w-8 tw-rounded-full tw-bg-[${color}]`}></div>

11
src/Components/Templates/ItemCard.tsx
View File

@ -1,8 +1,3 @@
/* eslint-disable @typescript-eslint/no-unnecessary-condition */
/* eslint-disable @typescript-eslint/no-unsafe-call */
/* eslint-disable @typescript-eslint/no-unsafe-return */
/* eslint-disable @typescript-eslint/restrict-template-expressions */
/* eslint-disable @typescript-eslint/no-explicit-any */
import { useNavigate } from 'react-router-dom'
import { StartEndView, TextView } from '#components/Map'
@ -22,7 +17,7 @@ export const ItemCard = ({
i: Item
loading: boolean
url: string
deleteCallback: any
deleteCallback: (item: Item) => void
}) => {
const navigate = useNavigate()
const windowDimensions = useWindowDimensions()
@ -34,8 +29,8 @@ export const ItemCard = ({
// We could have an onClick callback instead
const params = new URLSearchParams(window.location.search)
if (windowDimensions.width < 786 && i.position)
navigate('/' + i.id + `${params ? `?${params}` : ''}`)
else navigate(url + i.id + `${params ? `?${params}` : ''}`)
navigate('/' + i.id + `${params.size > 0 ? `?${params.toString()}` : ''}`)
else navigate(url + i.id + `${params.size > 0 ? `?${params.toString()}` : ''}`)
}}
>
<HeaderView

7
src/Components/Templates/MapOverlayPage.tsx
View File

@ -1,4 +1,3 @@
/* eslint-disable @typescript-eslint/restrict-template-expressions */
import { DomEvent } from 'leaflet'
import { createRef, useEffect } from 'react'
import { useNavigate } from 'react-router-dom'
@ -39,14 +38,14 @@ export function MapOverlayPage({
}, [overlayRef, backdropRef])
return (
<div className={`tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop && 'tw-z-[2000]'}`}>
<div className={`tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop ? 'tw-z-[2000]' : ''}`}>
<div
ref={backdropRef}
className={`${backdrop && 'tw-backdrop-brightness-75'} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`}
className={`${backdrop ? 'tw-backdrop-brightness-75' : ''} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`}
>
<div
ref={overlayRef}
className={`${card && 'tw-card tw-card-body'} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && 'tw-z-[2000]'} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`}
className={`${card ? 'tw-card tw-card-body' : ''} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className ?? ''} ${backdrop ? '' : 'tw-z-[2000]'} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`}
>
{children}
<button

12
src/Components/Templates/OverlayItemsIndexPage.tsx
View File

@ -1,10 +1,9 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable @typescript-eslint/prefer-optional-chain */
/* eslint-disable @typescript-eslint/no-misused-promises */
/* eslint-disable @typescript-eslint/no-non-null-assertion */
/* eslint-disable @typescript-eslint/no-unsafe-call */
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
/* eslint-disable @typescript-eslint/no-unsafe-argument */
/* eslint-disable @typescript-eslint/no-unsafe-call */
import { useEffect, useRef, useState } from 'react'
import { toast } from 'react-toastify'
@ -73,16 +72,16 @@ export const OverlayItemsIndexPage = ({
const layer = layers.find((l) => l.name === layerName)
const submitNewItem = async (evt: any) => {
const submitNewItem = async (evt: React.FormEvent<HTMLFormElement>) => {
evt.preventDefault()
const formItem: Item = {} as Item
Array.from(evt.target).forEach((input: HTMLInputElement) => {
Array.from(evt.target as any).forEach((input: HTMLInputElement) => {
if (input.name) {
formItem[input.name] = input.value
}
})
setLoading(true)
formItem.text &&
if (formItem.text) {
formItem.text
.toLocaleLowerCase()
.match(hashTagRegex)
@ -92,6 +91,7 @@ export const OverlayItemsIndexPage = ({
}
return null
})
}
const uuid = crypto.randomUUID()
let success = false
try {
@ -109,7 +109,7 @@ export const OverlayItemsIndexPage = ({
setAddItemPopupType('')
}
const deleteItem = async (item) => {
const deleteItem = async (item: Item) => {
setLoading(true)
let success = false
try {

4
src/Components/Templates/TagView.tsx
View File

@ -1,5 +1,3 @@
/* eslint-disable @typescript-eslint/restrict-template-expressions */
import { decodeTag } from '#utils/FormatTags'
import type { Tag } from '#types/Tag'
@ -21,7 +19,7 @@ export const TagView = ({
<div
key={tag.name}
onClick={onClick}
className={`tw-flex tw-items-center tw-flex-row tw-rounded-2xl tw-text-white tw-p-2 tw-px-4 tw-shadow-xl tw-card tw-mt-3 tw-mr-4 tw-cursor-pointer tw-w-fit ${heighlight && 'tw-border-4 tw-border-base-200 tw-shadow-lg'}`}
className={`tw-flex tw-items-center tw-flex-row tw-rounded-2xl tw-text-white tw-p-2 tw-px-4 tw-shadow-xl tw-card tw-mt-3 tw-mr-4 tw-cursor-pointer tw-w-fit ${heighlight ? 'tw-border-4 tw-border-base-200 tw-shadow-lg' : ''}`}
style={{ backgroundColor: tag.color ? tag.color : '#666' }}
>
<b>{decodeTag(tag.name)}</b>

8
src/Components/Templates/TitleCard.tsx
View File

@ -1,5 +1,3 @@
/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
/* eslint-disable @typescript-eslint/no-explicit-any */
import Subtitle from '#components/Typography/Subtitle'
interface TitleCardProps {
@ -8,7 +6,7 @@ interface TitleCardProps {
children?: React.ReactNode
topMargin?: string
className?: string
TopSideButtons?: any
TopSideButtons?: React.ReactNode
}
/**
@ -26,9 +24,9 @@ export function TitleCard({
<div
className={
'tw-card tw-w-full tw-p-6 tw-bg-base-100 tw-shadow-xl tw-h-fit tw-mb-4 ' +
(className || '') +
(className ?? '') +
' ' +
(topMargin || 'tw-mt-6')
(topMargin ?? 'tw-mt-6')
}
>
{!hideTitle && (

5
src/Components/Typography/ErrorText.tsx
View File

@ -1,7 +1,4 @@
/* eslint-disable @typescript-eslint/restrict-template-expressions */
// eslint-disable-next-line react/prop-types
function ErrorText({ styleClass, children }) {
function ErrorText({ styleClass, children }: { styleClass: string; children: React.ReactNode }) {
return <p className={`tw-text-center tw-text-error ${styleClass}`}>{children}</p>
}

7
src/Utils/RandomColor.ts
View File

@ -1,8 +1,3 @@
/* eslint-disable @typescript-eslint/restrict-template-expressions */
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
/* eslint-disable @typescript-eslint/no-unsafe-return */
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
/* eslint-disable @typescript-eslint/no-unsafe-call */
const goldenRatioConjugate = 0.618033988749895
export const randomColor = () => {
@ -53,7 +48,7 @@ function hsvToHex(h: number, s: number, v: number) {
return rgbToHex(Math.round(r * 255), Math.round(g * 255), Math.round(b * 255))
}
const rgbToHex = (r, g, b) =>
const rgbToHex = (r: number, g: number, b: number) =>
'#' +
[r, g, b]
.map((x) => {