import React from 'react';

import { Dash, useUpdateDash } from './useSaveDialog';
import { Position } from '../types';
import { removeDash } from '../requests';
import Dialog from './Dialog';

const UpdateDialog: React.FC<{
  dashConfig: Dash;
  isOpen: boolean;
  position?: Position | null;
  close: () => void;
}> = ({ dashConfig, isOpen, close, position }) => {
  const [
    { dashboard },
    { onChange, update, onChangeDash }
  ] = useUpdateDash(dashConfig);

  const remove = async () => {
    await removeDash(dashConfig.id);
    window.location.reload();
  };

  const openDashButtonView = null;

  return (
    <Dialog
      openDialogButton={openDashButtonView}
      isOpen={isOpen}
      dashboard={dashboard as Dash}
      position={position ?? null}
      closeDialog={close}
      onChange={onChange}
      update={update}
      remove={remove}
      onChangeDash={onChangeDash}
    />
  );
};

export default UpdateDialog;