From 4007775b861c441b576ec8de82d85d6921f14825 Mon Sep 17 00:00:00 2001
From: Ben Allfree <ben@benallfree.com>
Date: Tue, 24 Jan 2023 09:42:23 -0800
Subject: [PATCH] chore: doc fixes - draft mode, retina images

---
 packages/pockethost.io/src/app.d.ts                      | 9 ++++++++-
 packages/pockethost.io/src/docs/cloud_functions.md       | 1 +
 packages/pockethost.io/src/docs/faq.md                   | 3 ++-
 packages/pockethost.io/src/docs/ftp.md                   | 1 +
 packages/pockethost.io/src/docs/instances.md             | 1 +
 packages/pockethost.io/src/docs/introduction.md          | 5 ++++-
 packages/pockethost.io/src/env.ts                        | 4 +++-
 packages/pockethost.io/src/routes/docs/+layout.svelte    | 9 +++++++--
 .../src/routes/docs/[pageName]/+page.svelte              | 3 +++
 packages/pockethost.io/static/global.css                 | 1 +
 10 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/packages/pockethost.io/src/app.d.ts b/packages/pockethost.io/src/app.d.ts
index 070cabd9..c36c7c79 100644
--- a/packages/pockethost.io/src/app.d.ts
+++ b/packages/pockethost.io/src/app.d.ts
@@ -8,7 +8,14 @@ declare namespace App {
   // interface Platform {}
 }
 
-type DocPage = Metadata<{ title: string }>
+/**
+ * Taken from markdown plugin. For some reason importing here causes ts errors
+ */
+interface Metadata<TAttributes extends {} = {}> {
+  attributes: TAttributes
+  body: string
+}
+type DocPage = Metadata<{ title: string; published: boolean }>
 declare module '*.md' {
   const content: DocPage
   export = content
diff --git a/packages/pockethost.io/src/docs/cloud_functions.md b/packages/pockethost.io/src/docs/cloud_functions.md
index 6dfab47a..3c374274 100644
--- a/packages/pockethost.io/src/docs/cloud_functions.md
+++ b/packages/pockethost.io/src/docs/cloud_functions.md
@@ -1,5 +1,6 @@
 ---
 title: Cloud Functions
+published: false
 ---
 
 # Cloud Functions
diff --git a/packages/pockethost.io/src/docs/faq.md b/packages/pockethost.io/src/docs/faq.md
index 826db534..cec34b2d 100644
--- a/packages/pockethost.io/src/docs/faq.md
+++ b/packages/pockethost.io/src/docs/faq.md
@@ -1,5 +1,6 @@
 ---
-title: Frequently Asked Questions
+title: FAQ
+published: false
 ---
 
 # Frequently Asked Questions
diff --git a/packages/pockethost.io/src/docs/ftp.md b/packages/pockethost.io/src/docs/ftp.md
index 5499ba66..69ae52b8 100644
--- a/packages/pockethost.io/src/docs/ftp.md
+++ b/packages/pockethost.io/src/docs/ftp.md
@@ -1,5 +1,6 @@
 ---
 title: FTP Access to Instances
+published: false
 ---
 
 # FTP Access to Instances
diff --git a/packages/pockethost.io/src/docs/instances.md b/packages/pockethost.io/src/docs/instances.md
index cd383b6c..b52b12f9 100644
--- a/packages/pockethost.io/src/docs/instances.md
+++ b/packages/pockethost.io/src/docs/instances.md
@@ -1,5 +1,6 @@
 ---
 title: Managing Your Instance
+published: true
 ---
 
 # Managing your Instance
diff --git a/packages/pockethost.io/src/docs/introduction.md b/packages/pockethost.io/src/docs/introduction.md
index 9c977903..1c7e4c63 100644
--- a/packages/pockethost.io/src/docs/introduction.md
+++ b/packages/pockethost.io/src/docs/introduction.md
@@ -1,7 +1,10 @@
 ---
 title: Introduction
+published: true
 ---
 
 # PocketHost Docs
 
-## Instance
+Welcome to PocketHost!
+
+PocketHost is the zero-config, up-in-30-seconds hosting platform for PocketBase. If you're looking for a developer and production experience more like Firebase and Supabase, you've come to the right place.
diff --git a/packages/pockethost.io/src/env.ts b/packages/pockethost.io/src/env.ts
index f8fe5c5e..5f3b7973 100644
--- a/packages/pockethost.io/src/env.ts
+++ b/packages/pockethost.io/src/env.ts
@@ -1,3 +1,4 @@
+import { dev } from '$app/environment'
 import { env as _env } from '$env/dynamic/public'
 import publicRoutes from '$util/public-routes.json'
 import { boolean } from 'boolean'
@@ -17,7 +18,8 @@ export const envb = (name: string, _default: boolean) => boolean(env(name, _defa
 export const PUBLIC_APP_DB = env('PUBLIC_APP_DB', 'pockethost-central')
 export const PUBLIC_APP_DOMAIN = env('PUBLIC_APP_DOMAIN', 'pockethost.io')
 export const PUBLIC_APP_PROTOCOL = env('PUBLIC_APP_PROTOCOL', 'https')
-export const PUBLIC_DEBUG = envb('PUBLIC_DEBUG', false)
+
+export const PUBLIC_DEBUG = envb('PUBLIC_DEBUG', dev)
 
 export const PUBLIC_POCKETHOST_VERSION = base.version
 
diff --git a/packages/pockethost.io/src/routes/docs/+layout.svelte b/packages/pockethost.io/src/routes/docs/+layout.svelte
index d8f9fb1b..a331340f 100644
--- a/packages/pockethost.io/src/routes/docs/+layout.svelte
+++ b/packages/pockethost.io/src/routes/docs/+layout.svelte
@@ -1,12 +1,17 @@
 <script lang="ts">
+  import { PUBLIC_DEBUG } from '$src/env'
   import { pages } from '../../docs'
 </script>
 
 <div class="docs">
   <div class="container">
     <div class="toc">
-      {#each Object.entries(pages) as [v, k], i}
-        <div><a class="nav-link" href={`/docs/${v}`}>{k.attributes.title}</a></div>
+      {#each Object.entries(pages).filter(([k, p]) => p.attributes.published || PUBLIC_DEBUG) as [v, k], i}
+        <div>
+          <a class={`nav-link ${k.attributes.published ? '' : 'text-danger'}`} href={`/docs/${v}`}
+            >{k.attributes.title}</a
+          >
+        </div>
       {/each}
     </div>
     <div class="body">
diff --git a/packages/pockethost.io/src/routes/docs/[pageName]/+page.svelte b/packages/pockethost.io/src/routes/docs/[pageName]/+page.svelte
index 182e5b03..85a7318f 100644
--- a/packages/pockethost.io/src/routes/docs/[pageName]/+page.svelte
+++ b/packages/pockethost.io/src/routes/docs/[pageName]/+page.svelte
@@ -17,4 +17,7 @@
   }
 </script>
 
+{#if !md.attributes.published}
+  <div class="text-danger">Draft</div>
+{/if}
 {@html md.body}
diff --git a/packages/pockethost.io/static/global.css b/packages/pockethost.io/static/global.css
index d5fc8b63..d4513747 100644
--- a/packages/pockethost.io/static/global.css
+++ b/packages/pockethost.io/static/global.css
@@ -230,6 +230,7 @@ h6 {
 .docs img {
   max-width: 100%;
   height: auto;
+  transform: scale(0.5); /* Sangit is taking 2x pixel denisty images */
   border: 1px solid var(--bs-gray-500);
   padding: 15px;
 }