diff options
Diffstat (limited to 'src/frontend/tubo/comments/views.cljs')
| -rw-r--r-- | src/frontend/tubo/comments/views.cljs | 47 |
1 files changed, 32 insertions, 15 deletions
diff --git a/src/frontend/tubo/comments/views.cljs b/src/frontend/tubo/comments/views.cljs index e9b5867..e1f6472 100644 --- a/src/frontend/tubo/comments/views.cljs +++ b/src/frontend/tubo/comments/views.cljs @@ -6,23 +6,28 @@ [tubo.utils :as utils])) (defn comment-top-metadata - [{:keys [pinned? uploader-name uploader-url uploader-verified? stream-position]}] + [{:keys [pinned? uploader-name uploader-url uploader-verified? + stream-position]}] [:div.flex.items-center (when pinned? [:i.fa-solid.fa-thumbtack.mr-2.text-xs]) (when uploader-name [:div.flex.items-stretch - [:a {:href (rfe/href :channel-page nil {:url uploader-url}) - :title uploader-name} - [:h1.text-neutral-800.dark:text-gray-300.font-bold.line-clamp-1 uploader-name]] + [:a + {:href (rfe/href :channel-page nil {:url uploader-url}) + :title uploader-name} + [:h1.text-neutral-800.dark:text-gray-300.font-bold.line-clamp-1 + uploader-name]] (when stream-position [:div.text-neutral-600.dark:text-neutral-300 - [:span.mx-2.text-xs.whitespace-nowrap (utils/format-duration stream-position)]])]) + [:span.mx-2.text-xs.whitespace-nowrap + (utils/format-duration stream-position)]])]) (when uploader-verified? [:i.fa-solid.fa-circle-check.ml-2])]) (defn comment-bottom-metadata - [{:keys [upload-date like-count hearted-by-uploader? author-avatar author-name]}] + [{:keys [upload-date like-count hearted-by-uploader? author-avatar + author-name]}] [:div.flex.items-center.my-2 [:div.mr-4 [:p (utils/format-date-ago upload-date)]] @@ -34,8 +39,8 @@ [:div.relative.w-4.h-4.mx-2 [:i.fa-solid.fa-heart.absolute.-bottom-1.-right-1.text-xs.text-red-500] [:img.rounded-full.object-covermax-w-full.min-h-full - {:src author-avatar :title (str author-name " hearted this comment")}]])]) - + {:src author-avatar + :title (str author-name " hearted this comment")}]])]) (defn comment-item [{:keys [id text replies reply-count show-replies] :as comment}] @@ -44,7 +49,9 @@ [:div [comment-top-metadata comment] [:div.my-2 - [:p {:dangerouslySetInnerHTML {:__html text} :class "[overflow-wrap:anywhere]"}]] + [:p + {:dangerouslySetInnerHTML {:__html text} + :class "[overflow-wrap:anywhere]"}]] [comment-bottom-metadata comment] [:div.flex.items-center.cursor-pointer {:on-click #(rf/dispatch [:comments/toggle-replies id])} @@ -54,23 +61,33 @@ [:p.font-bold "Hide replies"] [:i.fa-solid.fa-turn-up.mx-2.text-xs]] [:<> - [:p.font-bold (str reply-count (if (= reply-count 1) " reply" " replies"))] + [:p.font-bold + (str reply-count (if (= reply-count 1) " reply" " replies"))] [:i.fa-solid.fa-turn-down.mx-2.text-xs]]))]]]) (defn comments - [{:keys [comments next-page disabled?]} {:keys [uploader-name uploader-avatar url]}] + [{:keys [comments next-page]} + {:keys [uploader-name uploader-avatar url]}] (let [pagination-loading? @(rf/subscribe [:show-pagination-loading]) - service-color @(rf/subscribe [:service-color])] + service-color @(rf/subscribe [:service-color])] [:div.flex.flex-col [:div - (for [[i {:keys [replies show-replies] :as comment}] (map-indexed vector comments)] + (for [[i {:keys [replies show-replies] :as comment}] + (map-indexed vector comments)] [:div.flex.flex-col {:key i} [:div.flex - [comment-item (assoc comment :author-name uploader-name :author-avatar uploader-avatar)]] + [comment-item + (assoc comment + :author-name uploader-name + :author-avatar uploader-avatar)]] (when (and replies show-replies) [:div {:style {:marginLeft "32px"}} (for [[i reply] (map-indexed vector (:items replies))] - ^{:key i} [comment-item (assoc reply :author-name uploader-name :author-avatar uploader-avatar)])])])] + ^{:key i} + [comment-item + (assoc reply + :author-name uploader-name + :author-avatar uploader-avatar)])])])] (when (:url next-page) (if pagination-loading? [layout/loading-icon service-color] |