| @@ -261,53 +261,52 @@ export default (() => { | |||||
| </MainArea> | </MainArea> | ||||
| <SidebarComponent> | <SidebarComponent> | ||||
| {comments.length > 0 && ( | |||||
| <form | |||||
| className="w-full h-5/6" | |||||
| onSubmit={async e => { | |||||
| e.preventDefault () | |||||
| if (!(content)) | |||||
| return | |||||
| try | |||||
| { | |||||
| setSending (true) | |||||
| await apiPost (`/theatres/${ id }/comments`, { content }) | |||||
| setContent ('') | |||||
| commentsRef.current?.scrollTo ({ | |||||
| top: commentsRef.current.scrollHeight, | |||||
| behavior: 'smooth' }) | |||||
| } | |||||
| finally | |||||
| { | |||||
| setSending (false) | |||||
| } | |||||
| }}> | |||||
| <div | |||||
| ref={commentsRef} | |||||
| className="overflow-x-hidden overflow-y-scroll text-wrap | |||||
| border border-black dark:border-white w-full h-3/4"> | |||||
| {comments.map (comment => ( | |||||
| <div key={comment.no} className="p-2"> | |||||
| <div className="w-full"> | |||||
| {comment.content} | |||||
| </div> | |||||
| <div className="w-full text-sm text-right"> | |||||
| by {comment.user ? (comment.user.name || '名もなきニジラー') : '運営'} | |||||
| </div> | |||||
| <div className="w-full text-sm text-right"> | |||||
| {dateString (comment.createdAt)} | |||||
| </div> | |||||
| </div>))} | |||||
| </div> | |||||
| <input | |||||
| className="w-full p-2 border border-black dark:border-white" | |||||
| type="text" | |||||
| value={content} | |||||
| onChange={e => setContent (e.target.value)} | |||||
| disabled={sending}/> | |||||
| </form>)} | |||||
| <form | |||||
| className="w-full h-5/6" | |||||
| onSubmit={async e => { | |||||
| e.preventDefault () | |||||
| if (!(content)) | |||||
| return | |||||
| try | |||||
| { | |||||
| setSending (true) | |||||
| await apiPost (`/theatres/${ id }/comments`, { content }) | |||||
| setContent ('') | |||||
| commentsRef.current?.scrollTo ({ | |||||
| top: commentsRef.current.scrollHeight, | |||||
| behavior: 'smooth' }) | |||||
| } | |||||
| finally | |||||
| { | |||||
| setSending (false) | |||||
| } | |||||
| }}> | |||||
| <div | |||||
| ref={commentsRef} | |||||
| className="overflow-x-hidden overflow-y-scroll text-wrap | |||||
| border border-black dark:border-white w-full h-3/4"> | |||||
| {comments.map (comment => ( | |||||
| <div key={comment.no} className="p-2"> | |||||
| <div className="w-full"> | |||||
| {comment.content} | |||||
| </div> | |||||
| <div className="w-full text-sm text-right"> | |||||
| by {comment.user ? (comment.user.name || '名もなきニジラー') : '運営'} | |||||
| </div> | |||||
| <div className="w-full text-sm text-right"> | |||||
| {dateString (comment.createdAt)} | |||||
| </div> | |||||
| </div>))} | |||||
| </div> | |||||
| <input | |||||
| className="w-full p-2 border border-black dark:border-white" | |||||
| type="text" | |||||
| value={content} | |||||
| onChange={e => setContent (e.target.value)} | |||||
| disabled={sending}/> | |||||
| </form> | |||||
| </SidebarComponent> | </SidebarComponent> | ||||
| <div className="md:hidden"> | <div className="md:hidden"> | ||||