Makes snapshots sticky

src/clj/auto_ap/ssr/admin.clj

@@ -172,7 +172,7 @@
                         (d/history (d/db conn))
                         entity-id )
                    inline-add-deletes
-                   (sort-by (comp :db/txInstant :tx))
+                   (sort-by (comp :db/id first))
                    vec)
           best-guess-entity (or (->> history
                                      (group-by  
@@ -195,34 +195,40 @@
                    [:table.table.compact.grid {:style "width: 100%"}
                     [:thead
                      [:tr
-                      [:td {:style "width: 12em"} "Transaction" ]
-                      [:td {:style "width: 12em"} "Date"]
-                      [:td {:style "width: 12em"} "User"]
-                      [:td {:style "width: 10em"} "Field"]
-                      [:td "Change"]]]
+                      [:td {:style "width: 14em"} "Date"]
+                      [:td {:style "width: 14em"} "User"]
+                      [:td {:style "width: 18em"} "Field"]
+                      [:td "From"]
+                      [:td "To"]]]
                     [:tbody
                      (for [[tx a c] history]
                        [:tr 
-                        [:td (:db/id tx)]
-                        [:td (some-> (:db/txInstant tx)
-                                     coerce/to-date-time
-                                     atime/localize
-                                     (atime/unparse atime/standard-time))]
+                        [:td [:div [:div (some-> (:db/txInstant tx)
+                                                 coerce/to-date-time
+                                                 atime/localize
+                                                 (atime/unparse atime/standard-time))
+                                    ]
+                              [:div.tag (:db/id tx)]]]
                         [:td (str (:audit/user tx))]
                         [:td (namespace a) ": " (name a)]
+
                         [:td
-                         [:div.tags
-                          [:div.tag.is-danger.is-light
-                           [:span 
-                            "FROM "
-                            (format-value (:removed c))]]
-                          [:div.tag.is-primary.is-light
-                           [:span 
-                            "TO "
-                            (format-value (:added c))]]]]])]
+                         [:div.tag.is-danger.is-light
+                          [:span 
+                           (format-value (:removed c))]]]
+                        [:td
+                         [:div.tag.is-primary.is-light
+                          [:span 
+                           (format-value (:added c))]]]])]
                     ]]
                   [:div.column.is-3
-                   [:div#inspector.card]]]]]
+                   [:div#inspector.box {:style {:position       "sticky"
+                                                :display        "inline-block"
+                                                :vertical-align "top"
+                                                :overflow-y     "auto"
+                                                :max-height     "100vh"
+                                                :top            "0px"
+                                                :bottom         "0px"}}]]]]]
 
       (alog/info ::trace
                  :bge best-guess-entity
@@ -252,8 +258,9 @@
                        ) ]
 
       (html-response 
-        [:div.box [:h1.title "Snapshot of "
-                   entity-id]
+        [:div {:style {:display "inline-block"}}
+         [:h1.title "Snapshot of "
+          entity-id]
          [:ul
           (for [[k v] data]
             [:li [:strong k] ":" v]