/**
 * Copyright (c) 2023-present Plane Software, Inc. and contributors
 * SPDX-License-Identifier: AGPL-3.0-only
 * See the LICENSE file for details.
 */

import { SlidersHorizontal } from "lucide-react";
import { useTranslation } from "@plane/i18n";
import { Button } from "@plane/propel/button";
import { useHome } from "@/hooks/store/use-home";
import { useWorkspace } from "@/hooks/store/use-workspace";

export function HomePageHeader() {
  const { t } = useTranslation();
  const { toggleWidgetSettings } = useHome();
  const { currentWorkspace } = useWorkspace();

  return (
    <div className="flex flex-wrap items-center justify-between gap-3">
      <div className="flex min-w-0 flex-col gap-1">
        <div className="inline-flex w-fit items-center gap-2 rounded-full bg-white/6 px-3 py-1.5 text-[11px] font-semibold tracking-[0.22em] text-placeholder uppercase">
          <span>Workspace Home</span>
        </div>
        <div className="text-13 text-secondary">
          {currentWorkspace?.name ? `Стартовый экран для ${currentWorkspace.name}` : "Главная страница workspace"}
        </div>
      </div>

      <Button
        variant="secondary"
        size="lg"
        className="nodedc-toolbar-pill"
        prependIcon={<SlidersHorizontal className="size-4" />}
        onClick={() => toggleWidgetSettings(true)}
      >
        {t("home.manage_widgets")}
      </Button>
    </div>
  );
}