import { ActionHandleStrategy } from '../../../dto/action-handle-strategies/action-handle-strategy.abstract';
/**
 * Update table properties action handler strategy
 */
export class UpdateTablePropertiesStrategy extends ActionHandleStrategy {
  /**
   * @inheritDoc
   */
  handleAction(action, target) {
    const annotation = action.toAnnotation();
    const tableRef = this.getDOMByEntity(target);
    if (tableRef) {
      // Update the table styles directly on the DOM element if possible to avoid the component re-render
      const tableContainer = tableRef.closest('.v-rte--extension-table-container');
      const { backgroundColorAnnotation, width, height } = annotation;
      tableRef.style.backgroundColor = backgroundColorAnnotation.renderStyle().color;
      tableRef.style.border = annotation.borderStr;
      tableRef.style.width = width;
      tableRef.style.height = height;
      const margin = annotation.renderAlignmentStyle().margin;
      tableRef.style.margin = margin;
      if (tableContainer) {
        tableContainer.style.width = width;
        tableContainer.style.height = height;
        tableContainer.style.margin = margin;
      }
      this.updateCustomStyleAnnotation(target, [
        'backgroundColor',
        'border',
        'width',
        'height',
        'margin',
      ]);
    }
  }
}
