Merge pull request #71 from UW-Macrostrat/explore-style

Minor fixes

Author: davidsklar99

pages/checkin/index.ts

@@ -10,6 +10,7 @@ import { Overlay2 } from "@blueprintjs/core";
 import { LithologyList } from "@macrostrat/data-components";
 import { ClientOnly } from "vike-react/ClientOnly";
 import { macrostratApiURL } from "@macrostrat-web/settings";
+import { ContentPage } from "~/layouts";
 
 function Map(props) {
   return h(
@@ -23,13 +24,22 @@ function Map(props) {
 }
 
 export function Checkins({checkin, comments}) {
-    console.log("Checkin data:", checkin);
+    if (checkin === undefined) {
+        return h('div', [
+            h(ContentPage, [
+                h('h2', "Checkin not found"),
+                h(Divider),
+                h('p', "This checkin does not exist or has been deleted."),
+            ]),
+            h(Footer)
+        ]);
+    }
     const center = {
         lat: checkin.lat,
         lng: checkin.lng
     }
 
-    let profile_pic = h('div.profile-header',h(BlankImage, {src: getProfilePicUrl(checkin.person_id), className: "profile-picture"}));
+    let profile_pic = h('div.profile-header', h(BlankImage, {src: getProfilePicUrl(checkin.person_id), className: "profile-picture"}));
 
     // format rating
     let ratingArr = [];
@@ -48,8 +58,8 @@ export function Checkins({checkin, comments}) {
     const headerBody = h('h4', {className: 'observation-header'}, checkin.notes);
 
     observations.push(
-        h('div', {className: 'observation'}, [
-           h('a', {href: "/photo/" + checkin.photo}, 
+        h.if(checkin.photo || checkin.notes)('div', {className: 'observation'}, [
+           h.if(checkin.photo)('a', {href: "/photo/" + checkin.photo}, 
                 h(BlankImage, { className: 'observation-image', src: imageSrc, alt: "presentation" })
             ),
             h("div.observation-body", headerBody),
@@ -61,9 +71,11 @@ export function Checkins({checkin, comments}) {
         // if photo exists
         const imageSrc = getImageUrl(checkin.person_id, observation.photo);
 
+        console.log("Observation data:", observation);
+
         observations.push(
-            h('div', {className: 'observation'}, [
-                h('a', {href: "/photo/" + observation.photo}, 
+            h.if(observation.photo || observation.lat || observation.lng || !objectNull(observation.fossils) || !objectNull(observation.minerals) || !objectNull(observation.rocks))('div', {className: 'observation'}, [
+                h.if(observation.photo)('a', {href: "/photo/" + observation.photo}, 
                     h(BlankImage, { className: 'observation-image', src: imageSrc })
                 ),
                 h(ObservationFooter, {observation}),
@@ -188,7 +200,7 @@ export function ObservationFooter({observation}) {
         lithologies.push({
             name: rocks.interval.name,
             int_id: rocks.interval.int_id,
-            color: `rgba(${rocks.interval.color})`,
+            color: rocks.interval.color.includes("#") ? rocks.interval.color : `rgba(${rocks.interval.color})`,
         })
     }
 
@@ -225,6 +237,8 @@ export function ObservationFooter({observation}) {
         }
     };
 
+    console.log("Rocks data:", lithologies);
+
     // observation body
     return h.if(show)("div", {className: 'observation-body'}, [
         observation.lat && rocks.strat_name?.strat_name_long ? h('h4', {className: 'observation-header'}, [
@@ -236,4 +250,8 @@ export function ObservationFooter({observation}) {
             h('p', {className: "notes"}, rocks.notes),
         ]),
     ]);
+}
+
+function objectNull(obj) {
+    return Object.keys(obj).length === 0 && obj.constructor === Object;
 }

pages/explore/+Page.client.ts

@@ -464,11 +464,6 @@ function AutoComplete({setFilteredData, autocompleteOpen, setAutocompleteOpen})
   const data = useRockdAPI(queryString + "&page=" + page)?.success.data;
   const nextData = useRockdAPI(queryString + "&page=" + (page + 1))?.success.data;
 
-  console.log("current", data)
-  console.log("next", nextData)
-
-  console.log(queryString + "&page=" + page)
-
   // add markers for filtered checkins
   let coordinates = [];
   let lngs = [];
@@ -729,14 +724,12 @@ function ClickedCheckins({setSelectedCheckin}) {
 
       if(cluster.length > 0) {
         const zoom = cluster[0].properties.expansion_zoom;
-        console.log("cluster", cluster[0]);
-
-        console.log("zoom", zoom);
 
         map.flyTo({
           center: cluster[0].geometry.coordinates,
           zoom: zoom + 2,
-          speed: 0.5,
+          speed: 10,
+          curve: .5,
         });
       }
 

pages/explore/main.module.sass

@@ -410,7 +410,7 @@ body
   width: 100px
 
 .selected
-  background-color: var(--accent-secondary-color)
+  background-color: var(--accent-secondary-color) !important
 
 .bp5-card, .bp5-navbar, .bp5-button
   border-radius: 4px