Skip to content

Commit

Permalink
Merge pull request #83 from goniszewski/77-top-level-category-does-no…
Browse files Browse the repository at this point in the history
…t-show-all-bookmarks-under-subcategories-or-the-subcategories-of-those-subcategories
  • Loading branch information
goniszewski authored Apr 4, 2024
2 parents dbf7daa + 8501cf4 commit 2066673
Show file tree
Hide file tree
Showing 19 changed files with 248 additions and 201 deletions.
44 changes: 21 additions & 23 deletions src/lib/components/AddBookmarkForm/AddBookmarkForm.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,7 @@
import { searchEngine } from '$lib/stores/search.store';
import { userSettingsStore } from '$lib/stores/user-settings.store';
import type { Metadata } from '$lib/types/Metadata.type';
import { validateUrlRegex } from '$lib/utils/regex-library';
import { addBookmarkToSearchIndex } from '$lib/utils/search';
import { showToast } from '$lib/utils/show-toast';
import { addBookmarkToSearchIndex, showToast, validateUrlRegex } from '$lib/utils';
import { IconInfoCircle } from '@tabler/icons-svelte';
import _ from 'lodash';
import { onDestroy } from 'svelte';
Expand Down Expand Up @@ -230,15 +228,15 @@
<input
type="text"
placeholder="Paste link here..."
class="join-item input input-secondary input-bordered w-full"
class="input join-item input-bordered input-secondary w-full"
name="url"
value={metadata.url}
on:input={onGetMetadata}
disabled={$loading}
/>
{#if metadata.url}
<button
class="join-item btn btn-primary"
class="btn btn-primary join-item"
on:click={() => {
// @ts-ignore-next-line
metadata.url = '';
Expand All @@ -254,9 +252,9 @@
<div class="loading loading-lg m-auto my-10" />
{/if}
{#if !$loading && metadata.url}
<div class="flex flex-col w-full">
<div class="flex flex-col md:flex-row items-start justify-between w-full gap-2">
<div class="flex flex-col md:flex-row items-center justify-between w-full gap-2">
<div class="flex w-full flex-col">
<div class="flex w-full flex-col items-start justify-between gap-2 md:flex-row">
<div class="flex w-full flex-col items-center justify-between gap-2 md:flex-row">
<div class="flex flex-none flex-col">
<label for="category" class="label">Category</label>
<Select
Expand All @@ -271,7 +269,7 @@
class="this-select input input-bordered w-full"
/>
</div>
<div class="flex flex-1 flex-col w-full">
<div class="flex w-full flex-1 flex-col">
<label for="tags" class="label">Tags</label>
<Select
name="tags"
Expand All @@ -294,8 +292,8 @@
</Select>
</div>
</div>
<div class="flex w-full md:w-4/12 gap-4 ml-4">
<div class="flex flex-col w-full">
<div class="ml-4 flex w-full gap-4 md:w-4/12">
<div class="flex w-full flex-col">
<label for="importance" class="label">Importance</label>
<div class="rating rating-md">
<input type="radio" name="importance" class="rating-hidden" value="" checked />
Expand All @@ -319,16 +317,16 @@
/>
</div>
</div>
<div class="flex flex-col w-full">
<div class="flex w-full flex-col">
<label for="flag" class="label whitespace-nowrap">Flag it?</label>
<label class="cursor-pointer label max-w-fit gap-2">
<label class="label max-w-fit cursor-pointer gap-2">
<!-- <span class="label-text">Flag</span> -->
<input type="checkbox" name="flagged" class="checkbox checkbox-error" />
<input type="checkbox" name="flagged" class="checkbox-error checkbox" />
</label>
</div>
</div>
</div>
<div class="flex flex-col w-full">
<div class="flex w-full flex-col">
<label for="title" class="label">Title</label>
<input
type="text"
Expand All @@ -342,7 +340,7 @@
}}
/>
</div>
<div class="flex flex-col w-full">
<div class="flex w-full flex-col">
<label for="icon" class="label">Icon</label>
<div class="flex gap-2">
<input
Expand All @@ -356,11 +354,11 @@
}}
/>
{#if metadata.icon_url}
<img class="w-8 h-8 m-auto md:ml-8" src={metadata.icon_url} alt={metadata.title} />
<img class="m-auto h-8 w-8 md:ml-8" src={metadata.icon_url} alt={metadata.title} />
{/if}
</div>
</div>
<div class="flex flex-col w-auto">
<div class="flex w-auto flex-col">
<label for="description" class="label">Description</label>
<textarea
class="textarea textarea-bordered"
Expand All @@ -376,7 +374,7 @@
<label for="main image" class="label">Main image</label>
{#if metadata.main_image_url}
<img
class="rounded-md m-auto max-h-64"
class="m-auto max-h-64 rounded-md"
src={metadata.main_image_url}
alt={metadata.title}
/>
Expand All @@ -392,7 +390,7 @@
}}
/>
</div>
<div class="flex flex-col w-auto">
<div class="flex w-auto flex-col">
<label for="content_text" class="label">Content (text)</label>
<textarea
class="textarea textarea-bordered"
Expand All @@ -405,7 +403,7 @@
}}
/>
</div>
<div class="flex flex-col w-full">
<div class="flex w-full flex-col">
<label for="author" class="label">Author</label>
<input
type="text"
Expand All @@ -415,7 +413,7 @@
placeholder="Extracted if possible..."
/>
</div>
<div class="flex flex-col w-auto">
<div class="flex w-auto flex-col">
<label for="note" class="label">Your note</label>
<textarea
class="textarea textarea-bordered"
Expand All @@ -432,7 +430,7 @@
{/if}

<button
class="btn btn-primary my-6 mx-auto w-full max-w-xs"
class="btn btn-primary mx-auto my-6 w-full max-w-xs"
disabled={$loading || !metadata.url || !metadata.title}>Add</button
>
</div>
Expand Down
38 changes: 19 additions & 19 deletions src/lib/components/AddCategoryForm/AddCategoryForm.svelte
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
<script lang="ts">
import Select from 'svelte-select';
import { writable } from 'svelte/store';
import { enhance } from '$app/forms';
import { page } from '$app/stores';
import Select from 'svelte-select';
import { writable } from 'svelte/store';
import { icons } from '$lib/enums/icons';
import Icon from '$lib/components/Icon/Icon.svelte';
import { showToast } from '$lib/utils/show-toast';
import { icons } from '$lib/enums/icons';
import type { Category } from '$lib/types/Category.type';
import { showToast } from '$lib/utils';
const category = writable<
Partial<
Expand Down Expand Up @@ -94,8 +94,8 @@
>
<input type="text" class="hidden" name="id" value={$category.id} />
<input type="text" class="hidden" name="icon" value={$category.icon} />
<div class="flex flex-col w-full gap-2">
<div class="flex flex-col w-full">
<div class="flex w-full flex-col gap-2">
<div class="flex w-full flex-col">
<label for="name" class="label">Name</label>
<input
type="text"
Expand All @@ -110,13 +110,13 @@
}}
/>
</div>
<div class="flex flex-col w-full">
<div class="flex w-full flex-col">
<label for="icon" class="label">Icon</label>
<div class="flex gap-1">
{#each icons as icon}
<div
class={`btn btn-circle btn-ghost btn-sm flex justify-center items-center p-1
${$category.icon === icon.id ? 'ring-primary ring-2 bg-primary bg-opacity-20' : ''}
class={`btn btn-circle btn-ghost btn-sm flex items-center justify-center p-1
${$category.icon === icon.id ? 'bg-primary bg-opacity-20 ring-2 ring-primary' : ''}
`}
title={icon.title}
role="button"
Expand All @@ -136,8 +136,8 @@
</div>
{/each}
<div
class={`btn btn-ghost btn-sm flex justify-center items-center p-1 text-xs
${$category.icon === '' ? 'ring-primary ring-2 bg-primary bg-opacity-20' : ''}
class={`btn btn-ghost btn-sm flex items-center justify-center p-1 text-xs
${$category.icon === '' ? 'bg-primary bg-opacity-20 ring-2 ring-primary' : ''}
`}
title="None"
role="button"
Expand All @@ -157,7 +157,7 @@
</div>
</div>
</div>
<div class="flex flex-col w-auto">
<div class="flex w-auto flex-col">
<label for="description" class="label">Description</label>
<textarea
class="textarea textarea-bordered"
Expand All @@ -174,11 +174,11 @@
<label for="color" class="label">Color</label>

<div class="flex gap-2">
<div class="flex flex-wrap max-w-[12rem] gap-1">
<div class="flex max-w-[12rem] flex-wrap gap-1">
{#each categoryColors as color}
<div
class={`w-6 h-6 rounded-full ${
$category.color === color ? 'ring-primary ring-2 bg-primary bg-opacity-20' : ''
class={`h-6 w-6 rounded-full ${
$category.color === color ? 'bg-primary bg-opacity-20 ring-2 ring-primary' : ''
}`}
style={`background-color: ${color};`}
role="button"
Expand All @@ -199,13 +199,13 @@
<div class="join">
<div class="tooltip" data-tip="Color preview">
<div
class="join-item border border-slate-600 w-6 h-12 flex flex-col justify-end"
class="join-item flex h-12 w-6 flex-col justify-end border border-slate-600"
style={`background-color: ${$category.color};`}
/>
</div>
<input
type="text"
class="join-item input input-bordered w-9/12 backdrop-invert"
class="input join-item input-bordered w-9/12 backdrop-invert"
name="color"
value={$category.color}
placeholder="E.g. #00FFFF"
Expand All @@ -217,7 +217,7 @@
</div>
</div>
</div>
<div class="flex flex-col w-auto">
<div class="flex w-auto flex-col">
<label for="parent" class="label">Parent</label>
<div class="tooltip" data-tip="Select parent category">
<Select
Expand All @@ -235,7 +235,7 @@
/>
</div>
</div>
<button class="btn btn-primary my-6 mx-auto w-full max-w-xs" disabled={!$category.name}
<button class="btn btn-primary mx-auto my-6 w-full max-w-xs" disabled={!$category.name}
>Save</button
>
</div>
Expand Down
Loading

0 comments on commit 2066673

Please sign in to comment.