40 lines
850 B
TypeScript
40 lines
850 B
TypeScript
import { ChangeEvent, memo } from "react"
|
|
|
|
import Input from "@components/input"
|
|
import styles from "./title.module.css"
|
|
|
|
const titlePlaceholders = [
|
|
"How to...",
|
|
"Status update for ...",
|
|
"My new project",
|
|
"My new idea",
|
|
"Let's talk about...",
|
|
"What's up with ...",
|
|
"I'm thinking about ..."
|
|
]
|
|
|
|
type props = {
|
|
onChange: (e: ChangeEvent<HTMLInputElement>) => void
|
|
title?: string
|
|
}
|
|
|
|
const Title = ({ onChange, title }: props) => {
|
|
const placeholder =
|
|
titlePlaceholders[Math.floor(Math.random() * titlePlaceholders.length)]
|
|
return (
|
|
<div className={styles.title}>
|
|
<h1>Drift</h1>
|
|
<Input
|
|
placeholder={placeholder}
|
|
value={title}
|
|
onChange={onChange}
|
|
label="Title"
|
|
className={styles.labelAndInput}
|
|
style={{ width: "100%" }}
|
|
labelClassName={styles.labelAndInput}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default memo(Title)
|