diff --git a/backend/app/controllers/posts_controller.rb b/backend/app/controllers/posts_controller.rb
index 96af1c1..ce555ed 100644
--- a/backend/app/controllers/posts_controller.rb
+++ b/backend/app/controllers/posts_controller.rb
@@ -3,20 +3,35 @@ class PostsController < ApplicationController
# GET /posts
def index
- limit = params[:limit].presence&.to_i
+ page = (params[:page].presence || 1).to_i
+ limit = (params[:limit].presence || 20).to_i
cursor = params[:cursor].presence
- created_at = ('COALESCE(posts.original_created_before - INTERVAL 1 SECOND,' +
- 'posts.original_created_from,' +
- 'posts.created_at)')
- q = filtered_posts.order(Arel.sql("#{ created_at } DESC"))
- q = q.where("#{ created_at } < ?", Time.iso8601(cursor)) if cursor
+ page = 1 if page < 1
+ limit = 1 if limit < 1
+
+ offset = (page - 1) * limit
- posts = limit ? q.limit(limit + 1) : q
+ sort_sql =
+ 'COALESCE(posts.original_created_before - INTERVAL 1 SECOND,' +
+ 'posts.original_created_from,' +
+ 'posts.created_at)'
+ q =
+ filtered_posts
+ .preload(:tags)
+ .with_attached_thumbnail
+ .select("posts.*, #{ sort_sql } AS sort_ts")
+ .order(Arel.sql("#{ sort_sql } DESC"))
+ posts = (
+ if cursor
+ q.where("#{ sort_sql } < ?", Time.iso8601(cursor)).limit(limit + 1)
+ else
+ q.limit(limit).offset(offset)
+ end).to_a
next_cursor = nil
- if limit && posts.size > limit
- next_cursor = posts.last.created_at.iso8601(6)
+ if cursor && posts.length > limit
+ next_cursor = posts.last.read_attribute('sort_ts').iso8601(6)
posts = posts.first(limit)
end
@@ -29,7 +44,7 @@ class PostsController < ApplicationController
nil
end
end
- }, next_cursor: }
+ }, count: filtered_posts.count(:id), next_cursor: }
end
def random
diff --git a/frontend/src/components/PostEmbed.tsx b/frontend/src/components/PostEmbed.tsx
index abb0fbe..c375ca1 100644
--- a/frontend/src/components/PostEmbed.tsx
+++ b/frontend/src/components/PostEmbed.tsx
@@ -1,3 +1,4 @@
+import { useState } from 'react'
import YoutubeEmbed from 'react-youtube'
import NicoViewer from '@/components/NicoViewer'
@@ -39,10 +40,28 @@ export default (({ post }: Props) => {
}
}
+ const [framed, setFramed] = useState (false)
+
return (
-
-
- )
+ <>
+ {framed
+ ? (
+