/*
 * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import { Button } from "@base-ui/react/button";
import { Add, CaretDown, Cog, SortAlphabetical, SortAlphabeticalDesc } from "@blueprintjs/icons";
import { arrayMove } from "@dnd-kit/sortable";
import classNames from "classnames";
import React, { useCallback, useEffect, useMemo, useState } from "react";
import { ActionButton } from "../base-components/action-button/ActionButton.js";
import { Dialog } from "../base-components/dialog/Dialog.js";
import { SearchableMenu } from "../base-components/searchable-menu/SearchableMenu.js";
import { useObjectTableLabels, withObjectTableLabels } from "./ObjectTableLabels.js";
import { SortableItemsList } from "./SortableItemsList.js";
import styles from "./MultiColumnSortDialog.module.css";
export const MultiColumnSortDialog = withObjectTableLabels(MultiColumnSortDialogInner);
function MultiColumnSortDialogInner({
  isOpen,
  onClose,
  onApply,
  currentSorting,
  columnOptions
}) {
  const labels = useObjectTableLabels();
  const [selectedSortColumns, setSelectedSortColumns] = useState([]);
  // Initialize selected sort columns from current sorting
  useEffect(() => {
    if (isOpen) {
      const selectedColumns = [];
      for (const sort of currentSorting) {
        const column = columnOptions.find(col => col.id === sort.id);
        if (column) {
          selectedColumns.push({
            ...column,
            direction: sort.desc ? "desc" : "asc"
          });
        }
      }
      setSelectedSortColumns(selectedColumns);
    }
  }, [isOpen, currentSorting, columnOptions]);
  const handleAddColumn = useCallback(column => {
    setSelectedSortColumns(prev => [...prev, {
      ...column,
      direction: "asc"
    }]);
  }, []);
  const handleRemoveSortColumn = useCallback(id => {
    setSelectedSortColumns(prev => prev.filter(item => item.id !== id));
  }, []);
  const handleReorderSortColumns = useCallback((fromIndex, toIndex) => {
    setSelectedSortColumns(items => arrayMove(items, fromIndex, toIndex));
  }, []);
  const handleToggleSortDirection = useCallback(id => {
    setSelectedSortColumns(prev => prev.map(item => item.id === id ? {
      ...item,
      direction: item.direction === "asc" ? "desc" : "asc"
    } : item));
  }, []);
  const handleApply = useCallback(() => {
    const sortingState = selectedSortColumns.map(col => ({
      id: col.id,
      desc: col.direction === "desc"
    }));
    onApply(sortingState);
    onClose();
  }, [selectedSortColumns, onApply, onClose]);
  const availableColumns = useMemo(() => columnOptions.filter(col => col.canSort && !selectedSortColumns.some(selected => selected.id === col.id)), [columnOptions, selectedSortColumns]);
  const searchableMenuItems = useMemo(() => availableColumns.map(col => ({
    key: col.id,
    label: col.name
  })), [availableColumns]);
  const handleMenuItemSelected = useCallback(key => {
    const column = availableColumns.find(col => col.id === key);
    if (column) {
      handleAddColumn(column);
    }
  }, [availableColumns, handleAddColumn]);
  const sortableItems = useMemo(() => {
    return selectedSortColumns.map(item => ({
      id: item.id,
      label: item.name,
      content: /*#__PURE__*/React.createElement("div", {
        className: styles.sortColumnItem
      }, /*#__PURE__*/React.createElement("span", {
        className: classNames(styles.sortColumnName, styles.truncate)
      }, item.name), /*#__PURE__*/React.createElement(Button, {
        className: styles.sortDirectionButton,
        onClick: () => handleToggleSortDirection(item.id),
        "aria-label": labels.sortDialogToggleDirection(item.name)
      }, item.direction === "asc" ? /*#__PURE__*/React.createElement(SortAlphabetical, {
        className: styles.sortIcon
      }) : /*#__PURE__*/React.createElement(SortAlphabeticalDesc, {
        className: styles.sortIcon
      })))
    }));
  }, [selectedSortColumns, handleToggleSortDirection, labels]);
  const footer = useMemo(() => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ActionButton, {
    onClick: onClose
  }, labels.sortDialogCancel), /*#__PURE__*/React.createElement(ActionButton, {
    variant: "primary",
    onClick: handleApply
  }, labels.sortDialogApply)), [handleApply, onClose, labels]);
  const dialogTitle = useMemo(() => /*#__PURE__*/React.createElement("div", {
    className: styles.title
  }, /*#__PURE__*/React.createElement(Cog, null), labels.sortDialogTitle), [labels]);
  return /*#__PURE__*/React.createElement(Dialog, {
    isOpen: isOpen,
    onOpenChange: onClose,
    title: dialogTitle,
    footer: footer
  }, /*#__PURE__*/React.createElement("div", {
    className: styles.sortColumnsList
  }, /*#__PURE__*/React.createElement(SortableItemsList, {
    items: sortableItems,
    onReorder: handleReorderSortColumns,
    onRemove: handleRemoveSortColumn,
    className: styles.sortableList
  }), /*#__PURE__*/React.createElement(SearchableMenu, {
    items: searchableMenuItems,
    onItemSelected: handleMenuItemSelected,
    trigger: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Add, {
      className: styles.addIcon
    }), /*#__PURE__*/React.createElement("span", {
      className: styles.addColumnText
    }, labels.sortDialogAddColumnToSort), /*#__PURE__*/React.createElement(CaretDown, null)),
    triggerClassName: styles.addColumnButton,
    disabled: availableColumns.length === 0,
    searchPlaceholder: labels.sortDialogSearchPlaceholder,
    emptyMessage: labels.sortDialogNoMatchingColumns
  })));
}
//# sourceMappingURL=MultiColumnSortDialog.js.map