default view is mobile if provide/inject fails

Author: theronhalsey

apps/oem-flood-finder/frontend/src/views/FinderView.vue

@@ -66,7 +66,7 @@ const {
 const locationSortMode = ref<PinboardTypes.SortMode>(
   ['located', 'watching'].includes(userLocationState.value) ? 'DistAsc' : '',
 )
-const isMobile = inject(IS_MOBILE_KEY, ref(false))
+const isMobile = inject(IS_MOBILE_KEY, ref(true))
 
 // computed refs
 const currentLocations = computed(() => {

apps/oem-flood-finder/frontend/src/views/ResourcesView.vue

@@ -6,7 +6,7 @@ import { IconChevronLeft } from '@phila/phila-ui-core/icons'
 import { IS_MOBILE_KEY } from '@pinboard/ui'
 import { inject, ref } from 'vue'
 
-const isMobile = inject(IS_MOBILE_KEY, ref(false))
+const isMobile = inject(IS_MOBILE_KEY, ref(true))
 const router = useRouter()
 </script>
 

apps/primary-care-finder/frontend/src/views/FinderView.vue

@@ -73,7 +73,7 @@ const defaultFilterState: PrimaryCareFilters = {
   },
 }
 
-const isMobile = inject(IS_MOBILE_KEY, ref(false))
+const isMobile = inject(IS_MOBILE_KEY, ref(true))
 const { t } = useI18n()
 const { locations, languages, isLoading, errorMessage, geojson } = useLocations()
 const { filterChipDefinitions } = useFilterChipDefinitions(languages)

apps/primary-care-finder/frontend/src/views/InfoView.vue

@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n'
 import { IS_MOBILE_KEY, PinboardInfoPage } from '@pinboard/ui'
 
 const { t } = useI18n()
-const isMobile = inject(IS_MOBILE_KEY, ref(false))
+const isMobile = inject(IS_MOBILE_KEY, ref(true))
 
 const sections = computed(() => [
   { id: 'insurance', title: t('introPage.section2Title') },

packages/eslint-config/package.json

@@ -11,11 +11,11 @@
     "@eslint/js": "catalog:",
     "eslint": "catalog:",
     "eslint-config-prettier": "catalog:",
-    "eslint-plugin-turbo": "^2.10.6",
     "eslint-plugin-vue": "catalog:",
-    "eslint-plugin-vue-scoped-css": "^3.1.1",
     "globals": "catalog:",
     "typescript": "catalog:",
-    "typescript-eslint": "catalog:"
+    "typescript-eslint": "catalog:",
+    "eslint-plugin-turbo": "^2.10.6",
+    "eslint-plugin-vue-scoped-css": "^3.1.1"
   }
 }

packages/ui/src/composables/useInitPinboardApp.ts

@@ -4,12 +4,28 @@ import { useIsMobile } from './useIsMobile'
 import { IS_MOBILE_KEY } from '../keys'
 
 export function useInitPinboardApp(localeAppKey?: string) {
-  const { locale, init, setLocale } = localeAppKey ? useLocale(localeAppKey) : {}
-  if (init) init()
-
   const infoSheetOpen = ref(false)
   const isDraggingSheet = ref(false)
   const dragY = ref(0)
+  const isMobile = useIsMobile()
+  const { locale, init, setLocale } = localeAppKey ? useLocale(localeAppKey) : {}
+
+  if (init) init()
+  provide(IS_MOBILE_KEY, isMobile)
+
+  /* Drag-down-to-dismiss. BottomSheet's built-in drag is snap-point based
+   * and a single snap point ([60]) clamps it to no movement, so we layer
+   * our own pointer tracking on top: translate the sheet to follow the
+   * pointer, dismiss past DRAG_DISMISS_THRESHOLD on release, otherwise
+   * spring back. Clicks (zero delta) pass through. */
+  const DRAG_DISMISS_THRESHOLD = 160
+  let dragStartY = 0
+
+  onBeforeUnmount(() => {
+    document.removeEventListener('pointermove', onSheetPointerMove)
+    document.removeEventListener('pointerup', onSheetPointerUp)
+    document.removeEventListener('pointercancel', onSheetPointerUp)
+  })
 
   function openInfoSheet(event: Event) {
     event.preventDefault()
@@ -22,14 +38,6 @@ export function useInitPinboardApp(localeAppKey?: string) {
     dragY.value = 0
   }
 
-  /* Drag-down-to-dismiss. BottomSheet's built-in drag is snap-point based
-   * and a single snap point ([60]) clamps it to no movement, so we layer
-   * our own pointer tracking on top: translate the sheet to follow the
-   * pointer, dismiss past DRAG_DISMISS_THRESHOLD on release, otherwise
-   * spring back. Clicks (zero delta) pass through. */
-  const DRAG_DISMISS_THRESHOLD = 160
-  let dragStartY = 0
-
   function onSheetPointerDown(e: PointerEvent) {
     dragStartY = e.clientY
     dragY.value = 0
@@ -57,15 +65,6 @@ export function useInitPinboardApp(localeAppKey?: string) {
     }
   }
 
-  const isMobile = useIsMobile()
-  provide(IS_MOBILE_KEY, isMobile)
-
-  onBeforeUnmount(() => {
-    document.removeEventListener('pointermove', onSheetPointerMove)
-    document.removeEventListener('pointerup', onSheetPointerUp)
-    document.removeEventListener('pointercancel', onSheetPointerUp)
-  })
-
   return {
     isMobile,
     locale,