| 1 | <script lang="ts"> |
| 2 | import { onMount } from "svelte"; |
| 3 | import Input from "../utility/Input.svelte"; |
| 4 | import Popup from "../utility/Popup.svelte"; |
| 5 | import Button from "../utility/Button.svelte"; |
| 6 | import { _openPopup } from "../../App.svelte"; |
| 7 | import { checkValidFileName } from "../File"; |
| 8 | import { invoke } from "@tauri-apps/api/core"; |
| 9 | import * as fs from "@tauri-apps/plugin-fs" |
| 10 | |
| 11 | export let title; |
| 12 | export let buttons; |
| 13 | export let description = ""; |
| 14 | export let options = {label: "Name: ", placeholder: "Enter text..."}; |
| 15 | export let path = ""; |
| 16 | let invalid = false; |
| 17 | let helpText = "" |
| 18 | let invalidText = ""; |
| 19 | |
| 20 | onMount(() => { |
| 21 | if (!options.placeholder) { |
| 22 | options.placeholder = "Enter text..." |
| 23 | } |
| 24 | }) |
| 25 | |
| 26 | let value = ""; |
| 27 | async function handleButtonClick(buttonAction, cancel) { |
| 28 | await buttonAction(value); |
| 29 | if (!invalid || cancel) { |
| 30 | _openPopup.set(false); |
| 31 | } |
| 32 | } |
| 33 | async function validateInput(button) { |
| 34 | if (!button.cancel && (!checkValidFileName(value) || value === undefined || !value)) { |
| 35 | invalid = true; |
| 36 | invalidText = `{${value === "" ? "null" : value}} is not a valid file name`; |
| 37 | return; |
| 38 | } |
| 39 | if (!button.cancel && await fs.exists(`${path}${p.sep}${value}`)) { |
| 40 | invalid = true; |
| 41 | if (await invoke("is_file", {path: path})) { |
| 42 | path = path.slice(0, path.indexOf(value)); |
| 43 | } |
| 44 | invalidText = `${value} in ${path} already exists`; |
| 45 | return; |
| 46 | } |
| 47 | await handleButtonClick(button.action, button.cancel); |
| 48 | } |
| 49 | // {name: "Cancel", cancel: true, style: "danger", action: () => {}} |
| 50 | </script> |
| 51 | <Popup bind:open={$_openPopup} {title} {description}> |
| 52 | <div class="rename-input"> |
| 53 | <Input bind:value bind:invalid label={"File Name"} placeholder={"Enter name..."} hintText={helpText} invalidText={invalidText} /> |
| 54 | </div> |
| 55 | <svelte:fragment slot="buttons"> |
| 56 | {#each buttons as button} |
| 57 | <Button label={button.name} style={button.style} on:click={() => {validateInput(button)}} /> |
| 58 | {/each} |
| 59 | </svelte:fragment> |
| 60 | </Popup> |
| 61 | |
| 62 | <style lang="scss"> |
| 63 | .rename-input { |
| 64 | display: flex; |
| 65 | } |
| 66 | </style> |