Thream/website
Archived
2
2
Fork 0
Code Issues Pull Requests Releases Activity

chore: better Prettier config for easier reviews

Browse Source
This commit is contained in:
Théo LUDWIG
2023-10-23 23:33:39 +02:00
parent a8781724d4
commit 71ea41695f
209 changed files with 4093 additions and 4114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
components/Application/SendMessage/SendMessage.tsx
View File

@ -1,12 +1,12 @@
import { useState, useRef } from 'react'
import useTranslation from 'next-translate/useTranslation'
import TextareaAutosize from 'react-textarea-autosize'
import classNames from 'clsx'
import { useState, useRef } from "react"
import useTranslation from "next-translate/useTranslation"
import TextareaAutosize from "react-textarea-autosize"
import classNames from "clsx"
import type { GuildsChannelsPath } from '..'
import { useAuthentication } from '../../../tools/authentication'
import type { EmojiPickerOnClick } from '../../Emoji'
import { EmojiPicker } from '../../Emoji'
import type { GuildsChannelsPath } from ".."
import { useAuthentication } from "../../../tools/authentication"
import type { EmojiPickerOnClick } from "../../Emoji"
import { EmojiPicker } from "../../Emoji"
export interface SendMessageProps {
path: GuildsChannelsPath
@ -18,54 +18,54 @@ export const SendMessage: React.FC<SendMessageProps> = (props) => {
const { authentication } = useAuthentication()
const [isVisibleEmojiPicker, setIsVisibleEmojiPicker] = useState(false)
const [message, setMessage] = useState('')
const [message, setMessage] = useState("")
const textareaReference = useRef<HTMLTextAreaElement>(null)
const handleTextareaKeyDown: React.KeyboardEventHandler<HTMLFormElement> = (
event
event,
) => {
if (event.key === 'Enter' && !event.shiftKey) {
if (event.key === "Enter" && !event.shiftKey) {
event.preventDefault()
event.currentTarget.dispatchEvent(
new Event('submit', { cancelable: true, bubbles: true })
new Event("submit", { cancelable: true, bubbles: true }),
)
}
}
const handleSubmit: React.FormEventHandler<HTMLFormElement> = async (
event
event,
) => {
event.preventDefault()
if (typeof message === 'string' && message.length > 0) {
if (typeof message === "string" && message.length > 0) {
await authentication.api.post(`/channels/${path.channelId}/messages`, {
value: message
value: message,
})
setMessage('')
setMessage("")
}
}
const handleTextareaChange: React.ChangeEventHandler<HTMLTextAreaElement> = (
event
event,
) => {
setMessage(event.target.value)
}
const handleFileChange: React.ChangeEventHandler<HTMLInputElement> = async (
event
event,
) => {
const files = event?.target?.files
if (files != null && files.length === 1 && files[0] != null) {
const file = files[0]
const formData = new FormData()
formData.append('file', file)
formData.append("file", file)
await authentication.api.post(
`/channels/${path.channelId}/messages/uploads`,
formData,
{
headers: {
'Content-Type': 'multipart/form-data'
}
}
"Content-Type": "multipart/form-data",
},
},
)
}
}
@ -77,7 +77,7 @@ export const SendMessage: React.FC<SendMessageProps> = (props) => {
}
const handleEmojiPicker: EmojiPickerOnClick = (emoji) => {
const emojiColons = emoji.colons ?? ''
const emojiColons = emoji.colons ?? ""
setMessage((oldMessage) => {
return oldMessage + emojiColons
})
@ -86,51 +86,51 @@ export const SendMessage: React.FC<SendMessageProps> = (props) => {
}
return (
<div className='relative p-6 pb-4'>
<div className="relative p-6 pb-4">
<div
className={classNames(
'absolute bottom-24 right-20 z-50 w-fit transition-all duration-100',
"absolute bottom-24 right-20 z-50 w-fit transition-all duration-100",
{
'invisible translate-y-5 opacity-0': !isVisibleEmojiPicker
}
"invisible translate-y-5 opacity-0": !isVisibleEmojiPicker,
},
)}
>
<EmojiPicker onClick={handleEmojiPicker} />
</div>
<div className='flex h-full w-full rounded-lg bg-gray-200 py-1 text-gray-600 dark:bg-gray-800 dark:text-gray-200'>
<div className="flex h-full w-full rounded-lg bg-gray-200 py-1 text-gray-600 dark:bg-gray-800 dark:text-gray-200">
<form
className='flex h-full w-full items-center'
className="flex h-full w-full items-center"
onSubmit={handleSubmit}
onKeyDown={handleTextareaKeyDown}
>
<TextareaAutosize
className='scrollbar-firefox-support my-2 w-full resize-none bg-transparent p-2 px-6 tracking-wide outline-none'
placeholder={t('application:write-a-message')}
wrap='soft'
className="scrollbar-firefox-support my-2 w-full resize-none bg-transparent p-2 px-6 tracking-wide outline-none"
placeholder={t("application:write-a-message")}
wrap="soft"
maxRows={6}
name='message'
name="message"
onChange={handleTextareaChange}
value={message}
ref={textareaReference}
/>
</form>
<div className='flex h-full items-center justify-around pr-6'>
<div className="flex h-full items-center justify-around pr-6">
<button
className='flex h-full w-full items-center justify-center p-1 text-2xl transition hover:-translate-y-1'
className="flex h-full w-full items-center justify-center p-1 text-2xl transition hover:-translate-y-1"
onClick={handleVisibleEmojiPicker}
>
🙂
</button>
<button className='relative flex h-full w-full cursor-pointer items-center justify-center p-1 text-green-800 transition hover:-translate-y-1 dark:text-green-400'>
<button className="relative flex h-full w-full cursor-pointer items-center justify-center p-1 text-green-800 transition hover:-translate-y-1 dark:text-green-400">
<input
type='file'
className='absolute h-full w-full cursor-pointer opacity-0'
type="file"
className="absolute h-full w-full cursor-pointer opacity-0"
onChange={handleFileChange}
/>
<svg width='25' height='25' viewBox='0 0 22 22'>
<svg width="25" height="25" viewBox="0 0 22 22">
<path
d='M11 0C4.925 0 0 4.925 0 11C0 17.075 4.925 22 11 22C17.075 22 22 17.075 22 11C22 4.925 17.075 0 11 0ZM12 15C12 15.2652 11.8946 15.5196 11.7071 15.7071C11.5196 15.8946 11.2652 16 11 16C10.7348 16 10.4804 15.8946 10.2929 15.7071C10.1054 15.5196 10 15.2652 10 15V12H7C6.73478 12 6.48043 11.8946 6.29289 11.7071C6.10536 11.5196 6 11.2652 6 11C6 10.7348 6.10536 10.4804 6.29289 10.2929C6.48043 10.1054 6.73478 10 7 10H10V7C10 6.73478 10.1054 6.48043 10.2929 6.29289C10.4804 6.10536 10.7348 6 11 6C11.2652 6 11.5196 6.10536 11.7071 6.29289C11.8946 6.48043 12 6.73478 12 7V10H15C15.2652 10 15.5196 10.1054 15.7071 10.2929C15.8946 10.4804 16 10.7348 16 11C16 11.2652 15.8946 11.5196 15.7071 11.7071C15.5196 11.8946 15.2652 12 15 12H12V15Z'
fill='currentColor'
d="M11 0C4.925 0 0 4.925 0 11C0 17.075 4.925 22 11 22C17.075 22 22 17.075 22 11C22 4.925 17.075 0 11 0ZM12 15C12 15.2652 11.8946 15.5196 11.7071 15.7071C11.5196 15.8946 11.2652 16 11 16C10.7348 16 10.4804 15.8946 10.2929 15.7071C10.1054 15.5196 10 15.2652 10 15V12H7C6.73478 12 6.48043 11.8946 6.29289 11.7071C6.10536 11.5196 6 11.2652 6 11C6 10.7348 6.10536 10.4804 6.29289 10.2929C6.48043 10.1054 6.73478 10 7 10H10V7C10 6.73478 10.1054 6.48043 10.2929 6.29289C10.4804 6.10536 10.7348 6 11 6C11.2652 6 11.5196 6.10536 11.7071 6.29289C11.8946 6.48043 12 6.73478 12 7V10H15C15.2652 10 15.5196 10.1054 15.7071 10.2929C15.8946 10.4804 16 10.7348 16 11C16 11.2652 15.8946 11.5196 15.7071 11.7071C15.5196 11.8946 15.2652 12 15 12H12V15Z"
fill="currentColor"
/>
</svg>
</button>

2
components/Application/SendMessage/index.ts
View File

@ -1 +1 @@
export * from './SendMessage'
export * from "./SendMessage"