Fixed flow vaultModal > inFileModal

This commit is contained in:
Simon Cambier
2022-04-20 12:17:47 +02:00
parent 359292de5c
commit 6b25d9a81f
4 changed files with 70 additions and 43 deletions

View File

@@ -1,26 +1,36 @@
<script lang="ts" context="module">
let lastSearch = ""
</script>
<script lang="ts"> <script lang="ts">
import CmpInput from "./CmpInput.svelte" import CmpInput from "./CmpInput.svelte"
import CmpResultInFile from "./CmpResultInFile.svelte" import CmpResultInFile from "./CmpResultInFile.svelte"
import { excerptAfter, type ResultNote, type SearchMatch } from "./globals" import { excerptAfter, type ResultNote, type SearchMatch } from "./globals"
import { plugin } from "./stores" import { plugin } from "./stores"
import { loopIndex } from "./utils" import { loopIndex } from "./utils"
import { tick } from "svelte" import { onMount, tick } from "svelte"
import { MarkdownView } from "obsidian" import { MarkdownView } from "obsidian"
import { getSuggestions } from "./search" import { getSuggestions } from "./search"
import type { OmnisearchModal } from "./modal" import type { ModalInFile, ModalVault } from "./modal"
export let modal: OmnisearchModal export let modal: ModalInFile
export let parent: OmnisearchModal | null = null export let parent: ModalVault | null = null
export let canGoBack = false
export let singleFilePath = "" export let singleFilePath = ""
let searchQuery: string export let searchQuery: string
let groupedOffsets: number[] = [] let groupedOffsets: number[] = []
let selectedIndex = 0 let selectedIndex = 0
let note: ResultNote | null = null let note: ResultNote | null = null
onMount(() => {
searchQuery = lastSearch
})
$: { $: {
if (searchQuery) {
note = getSuggestions(searchQuery, { singleFilePath })[0] ?? null note = getSuggestions(searchQuery, { singleFilePath })[0] ?? null
lastSearch = searchQuery
}
selectedIndex = 0 selectedIndex = 0
scrollIntoView() scrollIntoView()
} }
@@ -101,6 +111,7 @@ async function openSelection(): Promise<void> {
<div class="modal-title">Omnisearch - File</div> <div class="modal-title">Omnisearch - File</div>
<CmpInput <CmpInput
value={searchQuery}
on:input={(e) => (searchQuery = e.detail)} on:input={(e) => (searchQuery = e.detail)}
on:enter={openSelection} on:enter={openSelection}
on:arrow-up={() => moveIndex(-1)} on:arrow-up={() => moveIndex(-1)}
@@ -134,7 +145,7 @@ async function openSelection(): Promise<void> {
</div> </div>
<div class="prompt-instruction"> <div class="prompt-instruction">
<span class="prompt-instruction-command">esc</span> <span class="prompt-instruction-command">esc</span>
{#if canGoBack} {#if !!parent}
<span>to go back to Vault Search</span> <span>to go back to Vault Search</span>
{:else} {:else}
<span>to dismiss</span> <span>to dismiss</span>

View File

@@ -8,13 +8,13 @@ import { onMount, tick } from "svelte"
import CmpInput from "./CmpInput.svelte" import CmpInput from "./CmpInput.svelte"
import CmpResultNote from "./CmpResultNote.svelte" import CmpResultNote from "./CmpResultNote.svelte"
import type { ResultNote } from "./globals" import type { ResultNote } from "./globals"
import { OmnisearchModal } from "./modal" import { ModalInFile, type ModalVault } from "./modal";
import { openNote } from "./notes" import { openNote } from "./notes"
import { getSuggestions } from "./search" import { getSuggestions } from "./search"
import { plugin } from "./stores" import { plugin } from "./stores"
import { loopIndex } from "./utils" import { loopIndex } from "./utils"
export let modal: OmnisearchModal export let modal: ModalVault
let selectedIndex = 0 let selectedIndex = 0
let searchQuery: string let searchQuery: string
let resultNotes: ResultNote[] = [] let resultNotes: ResultNote[] = []
@@ -29,8 +29,7 @@ $: {
scrollIntoView() scrollIntoView()
} }
onMount(async () => { onMount(() => {
await tick()
searchQuery = lastSearch searchQuery = lastSearch
}) })
@@ -81,7 +80,7 @@ function onInputAltEnter(): void {
const file = $plugin.app.vault.getAbstractFileByPath(selectedNote.path) const file = $plugin.app.vault.getAbstractFileByPath(selectedNote.path)
if (file && file instanceof TFile) { if (file && file instanceof TFile) {
// modal.close() // modal.close()
new OmnisearchModal($plugin, file, true, modal).open() new ModalInFile($plugin, file, searchQuery, modal).open()
} }
} }
} }

View File

@@ -1,5 +1,4 @@
import { MarkdownView, Plugin, TFile } from 'obsidian' import { MarkdownView, Plugin, TFile } from 'obsidian'
import { OmnisearchModal } from './modal'
import { plugin } from './stores' import { plugin } from './stores'
import { import {
addToIndex, addToIndex,
@@ -7,6 +6,7 @@ import {
removeFromIndex, removeFromIndex,
removeFromIndexByPath, removeFromIndexByPath,
} from './search' } from './search'
import { ModalInFile, ModalVault } from './modal'
export default class OmnisearchPlugin extends Plugin { export default class OmnisearchPlugin extends Plugin {
async onload(): Promise<void> { async onload(): Promise<void> {
@@ -17,7 +17,7 @@ export default class OmnisearchPlugin extends Plugin {
id: 'show-modal', id: 'show-modal',
name: 'Vault search', name: 'Vault search',
callback: () => { callback: () => {
new OmnisearchModal(this).open() new ModalVault(this).open()
}, },
}) })
@@ -28,7 +28,7 @@ export default class OmnisearchPlugin extends Plugin {
const view = this.app.workspace.getActiveViewOfType(MarkdownView) const view = this.app.workspace.getActiveViewOfType(MarkdownView)
if (view) { if (view) {
if (!checking) { if (!checking) {
new OmnisearchModal(this, view.file).open() new ModalInFile(this, view.file).open()
} }
return true return true
} }

View File

@@ -3,13 +3,8 @@ import type OmnisearchPlugin from './main'
import CmpModalVault from './CmpModalVault.svelte' import CmpModalVault from './CmpModalVault.svelte'
import CmpModalInFile from './CmpModalInFile.svelte' import CmpModalInFile from './CmpModalInFile.svelte'
export class OmnisearchModal extends Modal { abstract class ModalOmnisearch extends Modal {
constructor( constructor(plugin: OmnisearchPlugin) {
plugin: OmnisearchPlugin,
file?: TFile,
canGoBack = false,
parent?: OmnisearchModal,
) {
super(plugin.app) super(plugin.app)
// Remove all the default modal's children (except the close button) // Remove all the default modal's children (except the close button)
@@ -18,19 +13,13 @@ export class OmnisearchModal extends Modal {
this.modalEl.replaceChildren() this.modalEl.replaceChildren()
this.modalEl.append(closeEl) this.modalEl.append(closeEl)
this.modalEl.addClass('omnisearch-modal', 'prompt') this.modalEl.addClass('omnisearch-modal', 'prompt')
if (file) {
new CmpModalInFile({
target: this.modalEl,
props: {
modal: this,
canGoBack,
singleFilePath: file.path,
parent: parent,
},
})
} }
else { }
export class ModalVault extends ModalOmnisearch {
constructor(plugin: OmnisearchPlugin) {
super(plugin)
new CmpModalVault({ new CmpModalVault({
target: this.modalEl, target: this.modalEl,
props: { props: {
@@ -38,5 +27,33 @@ export class OmnisearchModal extends Modal {
}, },
}) })
} }
}
export class ModalInFile extends ModalOmnisearch {
constructor(
plugin: OmnisearchPlugin,
file: TFile,
searchQuery: string = '',
parent?: ModalOmnisearch,
) {
super(plugin)
if (parent) {
// Hide the parent modal
parent.containerEl.toggleVisibility(false)
this.onClose = () => {
parent.containerEl.toggleVisibility(true)
}
}
new CmpModalInFile({
target: this.modalEl,
props: {
modal: this,
singleFilePath: file.path,
parent: parent,
searchQuery,
},
})
} }
} }