"https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/circle-dot.tsx": "1808df8c99ce83480354efe36a87093c0b64e9d090a48a341d53dfbb39944bce",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/circle.tsx": "d18a2316dca0b4409706f54da187a8aac2f4cef4382f78501ee1eb7e3f361ae5",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/copy.tsx": "990d45680d8839fd89ae9ef69222fc2b74e2226ea919ff0d0b04425840fdbd34",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/eye-off.tsx": "ed21825f9aeac5473e5cf412346239f72d606ab4a6ae202035322db765ec9f55",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/eye.tsx": "e473e51513658c7642fc50536ab9cf84c17273b1d03d8a68cd86579cb96bffea",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/info-circle.tsx": "95f8ce0771c4c8f9d8e1cd073adaa2e37fb118d8f0512fa0de35851cf15b3fe2",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/loader-2.tsx": "2043834bfba87c2121706d66aebdd7c0a3083460a59ed384e6b79df55ec5fe33",

    "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/triangle.tsx": "a5c7202080d3e3cc2a3a102f10878fe497da3f1d91b4d9a7141e3b75b19fdd56",

import IconAlertTriangle from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/alert-triangle.tsx";

import IconCircle from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/circle.tsx";

import IconCircleDot from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/circle-dot.tsx";

import IconEye from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/eye.tsx";

import IconEyeOff from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/eye-off.tsx";

import { FunctionComponent } from "preact";

import Progress from "../components/Progress.tsx";

import listDisplayContext from "../lib/listDisplayContext.ts";

  refreshFeed,

  removeFeed,

  setFeedCustomName,

  setFeedEnabled,

  setFeedUpdateFrequency,

} from "../state/operations.ts";

import { Feed } from "../state/State.ts";

  const resetTooltip = useTooltip(`Replace custom name '${feed.name}'`);

  const toggleEnabledTooltip = useTooltip(

    `${feed.enabled ? "Disable" : "Enable"} automatic feed updates`

  );

  const ToggleEnabledIcon = feed.enabled ? IconEye : IconEyeOff;

  const toggleEnabledText = `Feed ${feed.enabled ? "enabled" : "disabled"}`;

  const count = items.length;

  const readCount = items.reduce((sum, a) => sum + (a.isRead ? 1 : 0), 0);

  const unreadCount = count - readCount;

          Last update: <RelativeTime time={feed.lastUpdatedDateTime} />

        </div>

      )}

      <div>

      <div class={feed.enabled ? undefined : "opacity-60"}>

        Update frequency:{" "}

        <Select

          variant="transparent"

          </Button>

        </div>

      )}

      <div>

        {toggleEnabledTooltip.node}

        <Link

          ref={toggleEnabledTooltip.ref}

          onClick={() => dispatch(setFeedEnabled, feedId, !feed.enabled)}

        >

          <ToggleEnabledIcon

            size={"1em" as unknown as number}

            class="inline-block align-middle mr-2"

          />

          {toggleEnabledText}

        </Link>

      </div>

      <h3 class="text-xl mt-6 mb-4">Entries</h3>

      <div class="mb-2">

        <Button

  highlightItem,

  markFeedAsRead,

  markFeedAsUnread,

  setFeedEnabled,

  setFeedExpanded,

} from "../state/operations.ts";

import useAppState from "../state/useAppState.ts";

import IconAlertTriangle from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/alert-triangle.tsx";

import IconChevronRight from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/chevron-right.tsx";

import IconChevronDown from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/chevron-down.tsx";

import IconEyeOff from "https://deno.land/x/tabler_icons_tsx@0.0.2/tsx/eye-off.tsx";

import ListFeedEntry from "./ListFeedEntry.tsx";

import { Feed, FeedItem } from "../state/State.ts";

import useTooltip from "../lib/useTooltip.tsx";

  feed: Feed;

}

const EnableButton: FunctionComponent<{

  onClick(): void;

}> = ({ onClick }) => {

  const t = useTooltip("Enable feed");

  return (

    <>

      {t.node}

      <IconButton ref={t.ref} icon={IconEyeOff} onClick={onClick} />

    </>

  );

};

const ExpandButton: FunctionComponent<{

  expanded: boolean;

  dimmed: boolean;

const ListFeed: FunctionComponent<ListFeedProps> = ({ feed }) => {

  const { dispatch } = useAppState();

  let { feedId, expanded, items, name, lastError } = feed;

  let { feedId, expanded, enabled, items, name, lastError } = feed;

  const count = items.length;

  const readCount = items.reduce((sum, a) => sum + (a.isRead ? 1 : 0), 0);

  const expandShowsNothing = displayEntries === "unread" && items.length === 0;

  const expandButton = (

  const enableButton = !enabled && (

    <EnableButton

      onClick={() => {

        dispatch(setFeedEnabled, feedId, !enabled);

        dispatch(highlightItem, { type: "feed", feedId }, { force: true });

      }}

    />

  );

  const expandButton = enabled && (

    <ExpandButton

      expanded={expanded}

      dimmed={expandShowsNothing}

    />

  );

  const toggleReadButton = (

  const toggleReadButton = enabled && (

    <ToggleReadButton

      hasUnread={unreadCount > 0}

      disabled={count === 0}

      }

      error={!!lastError}

      name={name}

      unreadCount={expanded && !expandShowsNothing ? undefined : unreadCount}

      bold={unreadCount > 0 && displayFeeds === "all"}

      unreadCount={

        !enabled || (expanded && !expandShowsNothing) ? undefined : unreadCount

      }

      bold={enabled && unreadCount > 0 && displayFeeds === "all"}

      onClick={() => dispatch(highlightItem, { type: "feed", feedId })}

    />

  );

  const entriesList = expanded && (

  const entriesList = enabled && expanded && (

    <EntriesList

      feedId={feedId}

      text={

  return (

    <>

      <div class="flex gap-2">

      <div class={`flex gap-2 ${enabled ? "" : "opacity-60"}`}>

        <div class="whitespace-pre">

          {enableButton}

          {expandButton}

          {toggleReadButton}

        </div>

    updateUserFeed({ userId: this.#userId, feedId, updateFrequencyMinutes });

  }

  setFeedEnabled(feedId: number, enabled: boolean) {

    updateUserFeed({ userId: this.#userId, feedId, enabled });

  }

  saveSettings(settings: string) {

    updateUser({

      userId: this.#userId,

export default {

  id: "10_add_userFeed.enabled",

  sql: `

    ALTER TABLE userFeed

    ADD COLUMN enabled INTEGER NOT NULL DEFAULT 1;

    `,

};