padreug/nr-interior-design
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: VITE_DEV_TOOLS env-gate for preview tooling on deployed builds

Browse source 
Adds a useDevTools() composable that returns true when either Vite's
own DEV flag is set (local pnpm dev) or VITE_DEV_TOOLS='true' is
passed at build time. AppLayout's PaletteSwitcher now reads through
this composable, so the picker can render on earthwalker.aiolabs.dev
without flipping the build to development mode.

Single gate intentionally — future preview-only surfaces (debug
overlays, unfinished pages, work-in-progress UI) hook into the same
composable. Anything Nicholette should see but the public shouldn't
becomes a v-if="devTools" check. Set the var on the deploy host,
rebuild, surfaces appear; unset, surfaces vanish.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-05-27 11:59:26 +02:00
commit e7c62a2f8a
4 changed files with 27 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
.env.example
View file

@ -13,3 +13,9 @@ VITE_OWNER_NPUB=
# wss://relay.damus.io,wss://nos.lol,wss://relay.nostr.band # wss://relay.damus.io,wss://nos.lol,wss://relay.nostr.band
# The submission succeeds if at least one relay accepts the event. # The submission succeeds if at least one relay accepts the event.
VITE_NOSTR_RELAYS= VITE_NOSTR_RELAYS=
# Optional. Set to "true" to expose in-progress preview tooling on a
# production build — the palette picker today, future debug overlays
# or unfinished pages tomorrow. Gated through useDevTools(); unset
# (or anything other than "true") strips them.
VITE_DEV_TOOLS=

4
env.d.ts vendored
View file

@ -5,6 +5,10 @@ interface ImportMetaEnv {
readonly VITE_OWNER_NPUB?: string readonly VITE_OWNER_NPUB?: string
/** Comma-separated wss:// relay list; falls back to a default set if unset. */ /** Comma-separated wss:// relay list; falls back to a default set if unset. */
readonly VITE_NOSTR_RELAYS?: string readonly VITE_NOSTR_RELAYS?: string
/** When set to 'true', in-progress preview tooling (the palette
* picker today, future debug overlays / unfinished pages) renders
* in any build. Gated via useDevTools(). */
readonly VITE_DEV_TOOLS?: string
} }
interface ImportMeta { interface ImportMeta {

5
src/components/layout/AppLayout.vue
View file

@ -4,8 +4,9 @@ import { Toaster } from '@/components/ui/sonner'
import SiteHeader from './SiteHeader.vue' import SiteHeader from './SiteHeader.vue'
import SiteFooter from './SiteFooter.vue' import SiteFooter from './SiteFooter.vue'
import PaletteSwitcher from './PaletteSwitcher.vue' import PaletteSwitcher from './PaletteSwitcher.vue'
import { useDevTools } from '@/composables/useDevTools'
const isDev = import.meta.env.DEV const { enabled: devTools } = useDevTools()
</script> </script>
<template> <template>
@ -16,6 +17,6 @@ const isDev = import.meta.env.DEV
</main> </main>
<SiteFooter /> <SiteFooter />
<Toaster position="bottom-right" /> <Toaster position="bottom-right" />
<PaletteSwitcher v-if="isDev" /> <PaletteSwitcher v-if="devTools" />
</div> </div>
</template> </template>

14
src/composables/useDevTools.ts Normal file
View file

@ -0,0 +1,14 @@
/**
* True when the build should expose in-progress / preview tooling
* (the palette picker, future debug overlays, unfinished pages, etc.).
*
* Always true in local `pnpm dev` (Vite sets `import.meta.env.DEV`).
* Otherwise opted-in by setting `VITE_DEV_TOOLS=true` at build time —
* useful for a deployed preview the client uses to evaluate
* in-progress work.
*/
export function useDevTools() {
const enabled =
import.meta.env.DEV || import.meta.env.VITE_DEV_TOOLS === 'true'
return { enabled }
}