mirror of
https://github.com/supabase/supabase.git
synced 2026-10-16 22:59:11 +03:00
Francesco SansalvadoreandJonathan Summers-Muir
f05a7c60c1
* lw13 interactive realtime grid * 3d metal ticket * add dynamic text to ticket * reset ticket tilt on mouseout * improve canvas sizing and ticket positioning and originate tilt from ticket * test lw layout * test lw layout * fix imports * . * fix .length bug * usual ticketing flow * reduce ticket padding * reduce fade delay * add name from db * text size * use multiplayer.dev cursor logic * lodash samplesize * good state * working users cursors * single partyMode off * clean up * refactor ticket layout and positioning logic * regular and platinum tickets * regular theme based og * add mono font to ticket, finish textures and ogs * ticket cleanup * restore countdown with ticket * update og * update og * remote year add hour * drag ticket to flip * remove * add presence * remove cursor on own touch device * test hidden mobile cursor * fix mobile dragging * scale ticket on interaction * code logic * secret ticket logic * cleanup * persist won game * enable game on mobile * fix mobile game * add announcement banners * update text layout * hide game from share page and if game won * fix mobile flip 🎉 * fix meetups time formatting * faster flip * tiger init styling (#30649) * update * mobile fix --------- Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com> * use multilanguage font * lineheight * only published meetups * comment on timezone column * better mobile input positioning * fix sudden lighting change * increase cell size for better performance * increase cell size for better performance * last touches --------- Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
// import { IconLoader } from '@supabase/ui'
|
|
import { FC, RefObject } from 'react'
|
|
import { Message } from './types'
|
|
|
|
interface Props {
|
|
messages: Message[]
|
|
chatboxRef: RefObject<any>
|
|
messagesInTransit: string[]
|
|
areMessagesFetched: boolean
|
|
}
|
|
|
|
const Chatbox: FC<Props> = ({ messages, chatboxRef, messagesInTransit, areMessagesFetched }) => {
|
|
return (
|
|
<div className="flex flex-col rounded-md break-all">
|
|
<div
|
|
className="space-y-1 py-2 px-4 w-[400px]"
|
|
style={{ backgroundColor: 'rgba(0, 207, 144, 0.05)' }}
|
|
>
|
|
{!areMessagesFetched ? (
|
|
<div className="flex items-center space-x-2">
|
|
{/* <IconLoader className="animate-spin text-scale-1200" size={14} /> */}
|
|
<p className="text-sm text-scale-1100">Loading messages</p>
|
|
</div>
|
|
) : messages.length === 0 && messagesInTransit.length === 0 ? (
|
|
<div className="text-scale-1200 text-sm opacity-75">
|
|
<span>Type anything to start chatting 🥳</span>
|
|
</div>
|
|
) : (
|
|
<div />
|
|
)}
|
|
{messages.map((message) => (
|
|
<p key={message.id} className="text-scale-1200 text-sm whitespace-pre-line">
|
|
{message.message}
|
|
</p>
|
|
))}
|
|
{messagesInTransit.map((message, idx: number) => (
|
|
<p key={`transit-${idx}`} className="text-sm text-scale-1100">
|
|
{message}
|
|
</p>
|
|
))}
|
|
{/* <div ref={chatboxRef} className="!mt-0" /> */}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Chatbox
|