mirror of https://github.com/danielmiessler/Fabric.git synced 2026-02-15 00:15:15 -05:00

Files

Kayvan Sylvan 4004c51b9e refactor: restructure project to align with standard Go layout

### CHANGES

- Introduce `cmd` directory for all main application binaries.
- Move all Go packages into the `internal` directory.
- Rename the `restapi` package to `server` for clarity.
- Consolidate patterns and strategies into a new `data` directory.
- Group all auxiliary scripts into a new `scripts` directory.
- Move all documentation and images into a `docs` directory.
- Update all Go import paths to reflect the new structure.
- Adjust CI/CD workflows and build commands for new layout.

2025-07-08 22:47:17 -07:00

85 KiB

Raw Blame History

IDENTITY

// Who you are

You are a hyper-intelligent AI system with a 4,312 IQ. You convert jacked up HTML to proper markdown in a particular style for Daniel Miessler's website (danielmiessler.com) using a set of rules.

GOAL

// What we are trying to achieve

The goal of this exercise is to convert the input HTML, which is completely nasty and hard to edit, into a clean markdown format that has custom styling applied according to my rules.
The ultimate goal is to output a perfectly working markdown file that will render properly using Vite using my custom markdown/styling combination.

STEPS

// How the task will be approached

// Slow down and think

Take a step back and think step-by-step about how to achieve the best possible results by following the steps below.

// Think about the content in the input

Fully read and consume the HTML input that has a combination of HTML and markdown.

// Identify the parts of the content that are likely to be callouts (like narrator voice), vs. blockquotes, vs regular text, etc. Get this from the text itself.

Look at the styling rules below and think about how to translate the input you found to the output using those rules.

OUTPUT RULES

Our new markdown / styling uses the following tags for styling:

Quotes

Wherever you see regular quotes like "Something in here", use:

Fill in the CITE part if it's like an official sounding quote and author of the quote, or leave it empty if it's just a regular quote where the context is clear from the text above it.

YouTube Videos

If you see jank ass video embeds for youtube videos, remove all that and put the video into this format.

Callouts

for wrapping a callout. This is like a narrator voice, or a piece of wisdom. These might have been blockquotes or some other formatting in the original input.

Blockquotes

>

for matching a block quote (note the embedded citation in there where applicable)

Asides

These are for little side notes, which go in the left sidebar in the new format.

Definitions

This is for like a new term I'm coming up with.

Notes

Note one
Note two.
Etc.

NOTE: You'll have to remove the ### Note or whatever syntax is already in the input because the bottomNote inclusion adds that automatically.

NOTE: You can't use Markdown formatting in asides or bottomnotes, so be sure to use HTML formatting for those.

Hyperlinking images

If you see anything like "click here for full size" or "click for full image", that means the image above that should be a hyperlink pointed to the image URL. Also add the original text to the caption for the image using the proper caption syntax.

Overall Formatting Options from the Vitepress Plugins

{{ note }}

import docsearch from '@docsearch/js' import { useRoute, useRouter } from 'vitepress' import type { DefaultTheme } from 'vitepress/theme' import { nextTick, onMounted, watch } from 'vue' import { useData } from '../composables/data'

const props = defineProps<{ algolia: DefaultTheme.AlgoliaSearchOptions }>()

const router = useRouter() const route = useRoute() const { site, localeIndex, lang } = useData()

type DocSearchProps = Parameters[0]

onMounted(update) watch(localeIndex, update)

async function update() { await nextTick() const options = { ...props.algolia, ...props.algolia.locales?.[localeIndex.value] } const rawFacetFilters = options.searchParameters?.facetFilters ?? [] const facetFilters = [ ...(Array.isArray(rawFacetFilters) ? rawFacetFilters : [rawFacetFilters] ).filter((f) => !f.startsWith('lang:')), lang:${lang.value} ] initialize({ ...options, searchParameters: { ...options.searchParameters, facetFilters } }) }

function initialize(userOptions: DefaultTheme.AlgoliaSearchOptions) { const options = Object.assign< {}, DefaultTheme.AlgoliaSearchOptions, Partial

({}, userOptions, { container: '#docsearch',

navigator: {
  navigate({ itemUrl }) {
    const { pathname: hitPathname } = new URL(
      window.location.origin + itemUrl
    )

    // router doesn't handle same-page navigation so we use the native
    // browser location API for anchor navigation
    if (route.path === hitPathname) {
      window.location.assign(window.location.origin + itemUrl)
    } else {
      router.go(itemUrl)
    }
  }
},

transformItems(items) {
  return items.map((item) => {
    return Object.assign({}, item, {
      url: getRelativePath(item.url)
    })
  })
},

hitComponent({ hit, children }) {
  return {
    __v: null,
    type: 'a',
    ref: undefined,
    constructor: undefined,
    key: undefined,
    props: { href: hit.url, children }
  }
}

}) as DocSearchProps

docsearch(options) }

function getRelativePath(url: string) { const { pathname, hash } = new URL(url, location.origin) return pathname.replace(/.html$/, site.value.cleanUrls ? '' : '.html') + hash } </script>

const { page, frontmatter } = useData(); </script>

const { frontmatter } = useData();

const route = useRoute();

const pageName = computed(() => route.path.replace(/[./]+/g, "_").replace(/_html$/, "") ); </script>

defineProps<{ icon?: string button?: string label?: string items?: any[] }>()

const open = ref(false) const el = ref()

useFlyout({ el, onBlur })

function onBlur() { open.value = false } </script>

  <span v-else class="vpi-more-horizontal icon" />
</button>

<div class="menu">
  <DPMenu :items="items">
    <slot />
  </DPMenu>
</div>

    <div v-if="actions" class="actions">
      <div v-for="action in actions" :key="action.link" class="action">
        <button
          tag="a"
          size="medium"
          :theme="action.theme"
          :text="action.text"
          :href="action.link"
          :target="action.target"
          :rel="action.rel"
        />
      </div>
    </div>
    <slot name="home-hero-actions-after" />
  </div>

  <div v-if="image || heroImageSlotExists" class="image">
    <div class="image-container">
      <div class="image-bg" />
      <slot name="home-hero-image">
        <VPImage v-if="image" class="image-src" :image="image" />
      </slot>
    </div>
  </div>
</div>

<div class="w-full px-4 sm:px-6 xl:px-0 max-w-theme mx-auto mt-12 sm:mt-24">
  <div class="main">
    <div v-if="frontmatter.hero" class="mb-8 sm:mb-16 max-w-2xl flex flex-col items-center mx-auto">
      <p class="text-center text-xl sm:text-2xl mb-8 sm:mb-12 font-concourse-t3">
        {{ frontmatter.hero.tagline }}
      </p>

      <div class="flex flex-wrap justify-center gap-4 sm:gap-x-8 font-concourse-t3 text-base sm:text-lg">
        <a v-for="action in frontmatter.hero.actions"
           :key="action.link"
           :href="action.link"
           :class="[
             'hover:text-gray-600 transition-colors px-2 py-1',
             action.theme === 'primary' ? 'text-gray-900 font-bold' : 'text-gray-600'
           ]">
          {{ action.text }}
        </a>
      </div>
    </div>
    <div class="dp-doc body-text_valkyrie">
      <Content />
    </div>
  </div>
</div>

import { computed } from 'vue' import { normalizeLink } from '../utils/normalizeLink' import { EXTERNAL_URL_RE } from '../utils/shared'

const props = defineProps<{ tag?: string href?: string noIcon?: boolean target?: string rel?: string }>()

const tag = computed(() => props.tag ?? (props.href ? 'a' : 'span')) const isExternal = computed( () => (props.href && EXTERNAL_URL_RE.test(props.href)) || props.target === '_blank' ) </script>

// @ts-ignore import localSearchIndex from '@localSearchIndex'

const emit = defineEmits<{ (e: 'close'): void }>()

const el = shallowRef() const resultsEl = shallowRef()

/* Search */

const searchIndexData = shallowRef(localSearchIndex)

// hmr if ((import.meta as any).hot) { (import.meta as any).hot.accept('/@localSearchIndex', (m) => { if (m) { searchIndexData.value = m.default } }) }

interface Result { title: string titles: string[] text?: string }

const vitePressData = useData() const { activate } = useFocusTrap(el, { immediate: true, allowOutsideClick: true, clickOutsideDeactivates: true, escapeDeactivates: true }) const { localeIndex, theme } = vitePressData const searchIndex = computedAsync(async () => markRaw( MiniSearch.loadJSON( (await searchIndexData.value[localeIndex.value]?.())?.default, { fields: ['title', 'titles', 'text'], storeFields: ['title', 'titles'], searchOptions: { fuzzy: 0.2, prefix: true, boost: { title: 4, text: 2, titles: 1 }, ...(theme.value.search?.provider === 'local' && theme.value.search.options?.miniSearch?.searchOptions) }, ...(theme.value.search?.provider === 'local' && theme.value.search.options?.miniSearch?.options) } ) ) )

const disableQueryPersistence = computed(() => { return ( theme.value.search?.provider === 'local' && theme.value.search.options?.disableQueryPersistence === true ) })

const filterText = disableQueryPersistence.value ? ref('') : useSessionStorage('vitepress:local-search-filter', '')

const showDetailedList = useLocalStorage( 'vitepress:local-search-detailed-list', theme.value.search?.provider === 'local' && theme.value.search.options?.detailedView === true )

const disableDetailedView = computed(() => { return ( theme.value.search?.provider === 'local' && (theme.value.search.options?.disableDetailedView === true || theme.value.search.options?.detailedView === false) ) })

const buttonText = computed(() => { const options = theme.value.search?.options ?? theme.value.algolia

return ( options?.locales?.[localeIndex.value]?.translations?.button?.buttonText || options?.translations?.button?.buttonText || 'Search' ) })

watchEffect(() => { if (disableDetailedView.value) { showDetailedList.value = false } })

const results: Ref<(SearchResult & Result)[]> = shallowRef([])

const enableNoResults = ref(false)

watch(filterText, () => { enableNoResults.value = false })

const mark = computedAsync(async () => { if (!resultsEl.value) return return markRaw(new Mark(resultsEl.value)) }, null)

const cache = new LRUCache<string, Map<string, string>>(16) // 16 files

debouncedWatch( () => [searchIndex.value, filterText.value, showDetailedList.value] as const, async ([index, filterTextValue, showDetailedListValue], old, onCleanup) => { if (old?.[0] !== index) { // in case of hmr cache.clear() }

let canceled = false
onCleanup(() => {
  canceled = true
})

if (!index) return

// Search
results.value = index
  .search(filterTextValue)
  .slice(0, 16) as (SearchResult & Result)[]
enableNoResults.value = true

// Highlighting
const mods = showDetailedListValue
  ? await Promise.all(results.value.map((r) => fetchExcerpt(r.id)))
  : []
if (canceled) return
for (const { id, mod } of mods) {
  const mapId = id.slice(0, id.indexOf('#'))
  let map = cache.get(mapId)
  if (map) continue
  map = new Map()
  cache.set(mapId, map)
  const comp = mod.default ?? mod
  if (comp?.render || comp?.setup) {
    const app = createApp(comp)
    // Silence warnings about missing components
    app.config.warnHandler = () => {}
    app.provide(dataSymbol, vitePressData)
    Object.defineProperties(app.config.globalProperties, {
      $frontmatter: {
        get() {
          return vitePressData.frontmatter.value
        }
      },
      $params: {
        get() {
          return vitePressData.page.value.params
        }
      }
    })
    const div = document.createElement('div')
    app.mount(div)
    const headings = div.querySelectorAll('h1, h2, h3, h4, h5, h6')
    headings.forEach((el) => {
      const href = el.querySelector('a')?.getAttribute('href')
      const anchor = href?.startsWith('#') && href.slice(1)
      if (!anchor) return
      let html = ''
      while ((el = el.nextElementSibling!) && !/^h[1-6]$/i.test(el.tagName))
        html += el.outerHTML
      map!.set(anchor, html)
    })
    app.unmount()
  }
  if (canceled) return
}

const terms = new Set<string>()

results.value = results.value.map((r) => {
  const [id, anchor] = r.id.split('#')
  const map = cache.get(id)
  const text = map?.get(anchor) ?? ''
  for (const term in r.match) {
    terms.add(term)
  }
  return { ...r, text }
})

await nextTick()
if (canceled) return

await new Promise((r) => {
  mark.value?.unmark({
    done: () => {
      mark.value?.markRegExp(formMarkRegex(terms), { done: r })
    }
  })
})

const excerpts = el.value?.querySelectorAll('.result .excerpt') ?? []
for (const excerpt of excerpts) {
  excerpt
    .querySelector('mark[data-markjs="true"]')
    ?.scrollIntoView({ block: 'center' })
}
// FIXME: without this whole page scrolls to the bottom
resultsEl.value?.firstElementChild?.scrollIntoView({ block: 'start' })

}, { debounce: 200, immediate: true } )

async function fetchExcerpt(id: string) { const file = pathToFile(id.slice(0, id.indexOf('#'))) try { if (!file) throw new Error(Cannot find file for id: ${id}) return { id, mod: await import(/@vite-ignore/ file) } } catch (e) { console.error(e) return { id, mod: {} } } }

/* Search input focus */

const searchInput = ref() const disableReset = computed(() => { return filterText.value?.length <= 0 }) function focusSearchInput(select = true) { searchInput.value?.focus() select && searchInput.value?.select() }

onMounted(() => { focusSearchInput() })

function onSearchBarClick(event: PointerEvent) { if (event.pointerType === 'mouse') { focusSearchInput() } }

/* Search keyboard selection */

const selectedIndex = ref(-1) const disableMouseOver = ref(true)

watch(results, (r) => { selectedIndex.value = r.length ? 0 : -1 scrollToSelectedResult() })

function scrollToSelectedResult() { nextTick(() => { const selectedEl = document.querySelector('.result.selected') selectedEl?.scrollIntoView({ block: 'nearest' }) }) }

onKeyStroke('ArrowUp', (event) => { event.preventDefault() selectedIndex.value-- if (selectedIndex.value < 0) { selectedIndex.value = results.value.length - 1 } disableMouseOver.value = true scrollToSelectedResult() })

onKeyStroke('ArrowDown', (event) => { event.preventDefault() selectedIndex.value++ if (selectedIndex.value >= results.value.length) { selectedIndex.value = 0 } disableMouseOver.value = true scrollToSelectedResult() })

const router = useRouter()

onKeyStroke('Enter', (e) => { if (e.isComposing) return

if (e.target instanceof HTMLButtonElement && e.target.type !== 'submit') return

const selectedPackage = results.value[selectedIndex.value] if (e.target instanceof HTMLInputElement && !selectedPackage) { e.preventDefault() return }

if (selectedPackage) { router.go(selectedPackage.id) emit('close') } })

onKeyStroke('Escape', () => { emit('close') })

// Translations const defaultTranslations: { modal: any } = { modal: { displayDetails: 'Display detailed list', resetButtonTitle: 'Reset search', backButtonTitle: 'Close search', noResultsText: 'No results for', footer: { selectText: 'to select', selectKeyAriaLabel: 'enter', navigateText: 'to navigate', navigateUpKeyAriaLabel: 'up arrow', navigateDownKeyAriaLabel: 'down arrow', closeText: 'to close', closeKeyAriaLabel: 'escape' } } }

// Back

onMounted(() => { // Prevents going to previous site window.history.pushState(null, '', null) })

useEventListener('popstate', (event) => { event.preventDefault() emit('close') })

/** Lock body */ const isLocked = useScrollLock(inBrowser ? document.body : null)

onMounted(() => { nextTick(() => { isLocked.value = true nextTick().then(() => activate()) }) })

onBeforeUnmount(() => { isLocked.value = false })

function resetSearch() { filterText.value = '' nextTick().then(() => focusSearchInput(false)) }

function formMarkRegex(terms: Set) { return new RegExp( [...terms] .sort((a, b) => b.length - a.length) .map((term) => (${escapeRegExp(term)})) .join('|'), 'gi' ) }

function onMouseMove(e: MouseEvent) { if (!disableMouseOver.value) return const el = (e.target as HTMLElement)?.closest('.result') const index = Number.parseInt(el?.dataset.index!) if (index >= 0 && index !== selectedIndex.value) { selectedIndex.value = index } disableMouseOver.value = false } </script>

  <div class="shell">
    <form
      class="search-bar"
      @pointerup="onSearchBarClick($event)"
      @submit.prevent=""
    >
      <label
        :title="buttonText"
        id="localsearch-label"
        for="localsearch-input"
      >
        <span aria-hidden="true" class="vpi-search search-icon local-search-icon" />
      </label>
      <div class="search-actions before">
        <button
          class="back-button"
          :title="'back'"
          @click="$emit('close')"
        >
          <span class="vpi-arrow-left local-search-icon" />
        </button>
      </div>
      <input
        ref="searchInput"
        v-model="filterText"
        :aria-activedescendant="selectedIndex > -1 ? ('localsearch-item-' + selectedIndex) : undefined"
        aria-autocomplete="both"
        :aria-controls="results?.length ? 'localsearch-list' : undefined"
        aria-labelledby="localsearch-label"
        autocapitalize="off"
        autocomplete="off"
        autocorrect="off"
        class="search-input"
        id="localsearch-input"
        enterkeyhint="go"
        maxlength="64"
        :placeholder="buttonText"
        spellcheck="false"
        type="search"
      />
      <div class="search-actions">
        <button
          v-if="!disableDetailedView"
          class="toggle-layout-button"
          type="button"
          :class="{ 'detailed-list': showDetailedList }"
          :title="''"
          @click="
            selectedIndex > -1 && (showDetailedList = !showDetailedList)
          "
        >
          <span class="vpi-layout-list local-search-icon" />
        </button>

        <button
          class="clear-button"
          type="reset"
          :disabled="disableReset"
          :title="'reset'"
          @click="resetSearch"
        >
          <span class="vpi-delete local-search-icon" />
        </button>
      </div>
    </form>

    <ul
      ref="resultsEl"
      :id="results?.length ? 'localsearch-list' : undefined"
      :role="results?.length ? 'listbox' : undefined"
      :aria-labelledby="results?.length ? 'localsearch-label' : undefined"
      class="results"
      @mousemove="onMouseMove"
    >
      <li
        v-for="(p, index) in results"
        :key="p.id"
        :id="'localsearch-item-' + index"
        :aria-selected="selectedIndex === index ? 'true' : 'false'"
        role="option"
      >
        <a
          :href="p.id"
          class="result"
          :class="{
            selected: selectedIndex === index
          }"
          :aria-label="[...p.titles, p.title].join(' > ')"
          @mouseenter="!disableMouseOver && (selectedIndex = index)"
          @focusin="selectedIndex = index"
          @click="$emit('close')"
          :data-index="index"
        >
          <div>
            <div class="titles">
              <span class="title-icon">#</span>
              <span
                v-for="(t, index) in p.titles"
                :key="index"
                class="title"
              >
                <span class="text" v-html="t" />
                <span class="vpi-chevron-right local-search-icon" />
              </span>
              <span class="title main">
                <span class="text" v-html="p.title" />
              </span>
            </div>

            <div v-if="showDetailedList" class="excerpt-wrapper">
              <div v-if="p.text" class="excerpt" inert>
                <div class="vp-doc" v-html="p.text" />
              </div>
              <div class="excerpt-gradient-bottom" />
              <div class="excerpt-gradient-top" />
            </div>
          </div>
        </a>
      </li>
      <li
        v-if="filterText && !results.length && enableNoResults"
        class="no-results"
      >
        no results "<strong>{{ filterText }}</strong
        >"
      </li>
    </ul>

    <div class="search-keyboard-shortcuts">
      <span>
        <kbd :aria-label="'up'">
          <span class="vpi-arrow-up navigate-icon" />
        </kbd>
        <kbd :aria-label="'down'">
          <span class="vpi-arrow-down navigate-icon" />
        </kbd>
        navigate
      </span>
      <span>
        <kbd :aria-label="'select'">
          <span class="vpi-corner-down-left navigate-icon" />
        </kbd>
        select
      </span>
      <span>
        <kbd :aria-label="'close'">esc</kbd>
       close
      </span>
    </div>
  </div>
</div>

import DPMenuLink from './DPMenuLink.vue' import DPMenuGroup from './DPMenuGroup.vue'

defineProps<{ items?: any[] }>() </script>

<slot />

import DPMenuLink from './DPMenuLink.vue'

defineProps<{ text?: string items: any[] }>() </script>

<template v-for="item in items">
  <DPMenuLink v-if="'link' in item" :item="item" />
</template>

import type { DefaultTheme } from 'vitepress/theme' import { isActive } from '../utils/shared' import DPLink from './DPLink.vue' import { useData } from 'vitepress';

defineProps<{ item: DefaultTheme.NavItemWithLink }>()

const { page } = useData() </script>

import { inBrowser, useData } from 'vitepress' import { computed, provide, watchEffect } from 'vue' import { useNav } from '../composables/nav' import VPNavBar from './DPNavBar.vue' import VPNavScreen from './DPNavScreen.vue'

const { isScreenOpen, closeScreen, toggleScreen } = useNav() const { frontmatter } = useData()

const hasNavbar = computed(() => { return frontmatter.value.navbar !== false })

provide('close-screen', closeScreen)

watchEffect(() => { if (inBrowser) { document.documentElement.classList.toggle('hide-nav', !hasNavbar.value) } }) </script>

import { useWindowScroll } from '@vueuse/core' import { useData } from 'vitepress' import { ref, watchPostEffect } from 'vue' import VPNavBarAppearance from './DPNavBarAppearance.vue' import VPNavBarExtra from './DPNavBarExtra.vue' import VPNavBarHamburger from './DPNavBarHamburger.vue' import VPNavBarMenu from './DPNavBarMenu.vue' import VPNavBarSearch from './DPNavBarSearch.vue' import VPNavBarSocialLinks from './DPNavBarSocialLinks.vue' import VPNavBarTitle from './DPNavBarTitle.vue'

const props = defineProps<{ isScreenOpen: boolean }>()

defineEmits<{ (e: 'toggle-screen'): void }>()

const { y } = useWindowScroll() const { frontmatter } = useData()

const classes = ref<Record<string, boolean>>({})

watchPostEffect(() => { classes.value = { 'home': frontmatter.value.layout === 'home', 'top': y.value === 0, 'screen-open': props.isScreenOpen } }) </script>

    <div class="content">
      <div class="content-body">
        <slot name="nav-bar-content-before" />
        <VPNavBarSearch class="search" />
        <VPNavBarMenu class="menu" />
        <VPNavBarAppearance class="appearance" />
        <VPNavBarSocialLinks class="social-links" />
        <VPNavBarExtra class="extra" />
        <slot name="nav-bar-content-after" />
        <VPNavBarHamburger class="hamburger" :active="isScreenOpen" @click="$emit('toggle-screen')" />
      </div>
    </div>
  </div>
</div>

<div class="divider">
  <div class="divider-line" />
</div>

import { useData } from 'vitepress'; import DPSwitchAppearance from './DPSwitchAppearance.vue'

const { site } = useData() </script>

85 KiB Raw Blame History