Layout tweaks (#10365)

* Cleanup review items

* Fix spacing

* Fix -1 text

* Cleanup scroll

* Show activity indicator when review items are null

* Show no preview text when not found

* Add padding to buttons

* Simplify comparisons

web/src/components/filter/ReviewFilterGroup.tsx

@@ -212,7 +212,7 @@ function CamerasFilterButton({
         ))}
       </div>
       <DropdownMenuSeparator />
-      <div className="flex justify-evenly items-center">
+      <div className="p-2 flex justify-evenly items-center">
         <Button
           variant="select"
           onClick={() => {
@@ -312,7 +312,7 @@ function CalendarFilterButton({
         }}
       />
       <DropdownMenuSeparator />
-      <div className="flex justify-center items-center">
+      <div className="p-2 flex justify-center items-center">
         <Button
           variant="secondary"
           onClick={() => {
@@ -421,7 +421,7 @@ function GeneralFilterButton({
         ))}
       </div>
       <DropdownMenuSeparator />
-      <div className="flex justify-evenly items-center">
+      <div className="p-2 flex justify-evenly items-center">
         <Button
           variant="select"
           onClick={() => {

web/src/components/player/PreviewVideoPlayer.tsx

@@ -140,6 +140,11 @@ export default function PreviewVideoPlayer({
           <source src={currentPreview.src} type={currentPreview.type} />
         )}
       </video>
+      {cameraPreviews && !currentPreview && (
+        <div className="absolute inset-x-0 top-1/2 -y-translate-1/2 bg-black text-white rounded-2xl align-center text-center">
+          No Preview Found
+        </div>
+      )}
     </div>
   );
 }