#302

frontend/src/pages/theatres/TheatreDetailPage.tsx

@@ -55,9 +55,9 @@ const LAYOUT_STORAGE_KEY = 'theatre-layout-mode'
 const TAG_FLOW_STORAGE_KEY = 'theatre-tag-flow'
 
 const LAYOUT_LABELS: Record<TheatreLayoutMode, string> = {
-    threeColumns:   '3 コラム',
-    tagsBottom:     'タグ下',
-    commentsBottom: 'コメント下' }
+    threeColumns:   '3 列',
+    tagsBottom:     '2 列（コメント欄）',
+    commentsBottom: '2 列（タグ欄）' }
 
 const TAG_FLOW_LABELS: Record<TagFlow, string> = {
     vertical:   'タグ縦',
@@ -118,8 +118,9 @@ const tagsByCategory = (tags: Tag[]): Partial<Record<Category, Tag[]>> => {
 }
 
 
-const TagList: FC<{ tags: Tag[]; compact?: boolean; flow?: TagFlow }> =
-({ tags, compact, flow = 'vertical' }) => {
+const TagList: FC<{ tags: Tag[]; compact?: boolean; flow?: TagFlow }> = (
+    { tags, compact, flow = 'vertical' },
+) => {
   const grouped = tagsByCategory (tags)
 
   if (flow === 'horizontal')
@@ -463,8 +464,10 @@ const TheatreDetailPage: FC<Props> = ({ user }: Props) => {
     {
       const nextInfo =
 	  theatreInfo.skipVote.voted
-	  ? await apiDelete<TheatreInfo> (`/theatres/${ id }/skip_vote`)
-	  : await apiPut<TheatreInfo> (`/theatres/${ id }/skip_vote`)
+	  ? await apiDelete<TheatreInfo> (
+	      `/theatres/${ id }/skip_vote`, { params: { post_id: post.id } })
+	  : await apiPut<TheatreInfo> (
+	      `/theatres/${ id }/skip_vote`, { post_id: post.id })
 
       applyTheatreInfo (nextInfo)
 
@@ -477,6 +480,9 @@ const TheatreDetailPage: FC<Props> = ({ user }: Props) => {
     }
     catch (error)
     {
+      if (isApiError (error) && error.response?.status === 409)
+	applyTheatreInfo (await apiPut<TheatreInfo> (`/theatres/${ id }/watching`))
+
       console.error (error)
     }
     finally
@@ -635,7 +641,7 @@ const TheatreDetailPage: FC<Props> = ({ user }: Props) => {
 	  {theatreInfo.watchingUsers.map (watchingUser => (
 	      <div key={watchingUser.id} className="flex justify-between gap-2 text-sm">
 		<span>{userName (watchingUser)}</span>
-		{watchingUser.id === user?.id && <span className="text-zinc-500">自分</span>}
+		{watchingUser.id === user?.id && <span className="text-zinc-500">お前</span>}
 	      </div>))}
 	</div>
       </section>)