import { r as registerInstance, c as createEvent, h, H as Host } from './index-ecdfb761.js';
import { R as ResponsiveSize } from './ui-0156b0ee.js';
import { C as CalendarUtils } from './calendar-470c802a.js';
import './index-a3ca021c.js';
import './_commonjsHelpers-27f122dd.js';
import './moment-65eca6b3.js';

const atamaStructuredPairSessionOverviewCss = "atama-structured-pair-session-overview p,atama-structured-pair-session-overview h3{margin:var(--spacing-unit) 0}atama-structured-pair-session-overview .error-text{color:var(--color-danger)}atama-structured-pair-session-overview .break-line{height:1px;color:var(--color-background-secondary)}atama-structured-pair-session-overview .meeting-data{font-size:var(--font-size-medium);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;-ms-flex-align:center;align-items:center}atama-structured-pair-session-overview .border-dashed{border-style:dashed !important;border-width:1px !important}atama-structured-pair-session-overview .meeting-date{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;background-color:var(--color-background-secondary);font-weight:bold;color:var(--color-text);min-width:65px;max-width:-webkit-min-content;max-width:-moz-min-content;max-width:min-content;min-height:70px;max-height:70px;border-radius:var(--corner-radius);text-align:center}atama-structured-pair-session-overview .meeting-date .day-and-month{font-size:var(--font-size-medium);font-weight:bold;display:-ms-flexbox;display:flex;-ms-flex-preferred-size:min-content;flex-basis:min-content}atama-structured-pair-session-overview .meeting-date .meeting-year{font-weight:100}atama-structured-pair-session-overview .clickable:hover{cursor:pointer;text-decoration:underline}atama-structured-pair-session-overview .font-medium{font-size:var(--font-size-medium)}atama-structured-pair-session-overview .meeting-time{font-size:var(--font-size-medium);color:var(--color-neutral)}atama-structured-pair-session-overview .zero-margin-icon i::before{margin:0}atama-structured-pair-session-overview .custom-address{color:var(--color-text-title)}atama-structured-pair-session-overview h4{margin:0}";

const AtamaStructuredPairSessionOverview = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.action = createEvent(this, "action", 7);
    this.meetingsByIdentifiers = {};
    this.renderHasSessionDesign = (meetingGoal, sessionName) => {
      var _a, _b, _c, _d, _e;
      const meetingDayAndMonth = CalendarUtils.format(new Date(meetingGoal.startDate), 'MMM DD');
      const day = CalendarUtils.format(new Date(meetingGoal.startDate), 'dddd');
      const directionBetweenDatesInMinutes = getMinutesBetweenDates(new Date(meetingGoal.startDate), new Date(meetingGoal.endDate));
      const startDate = CalendarUtils.format(new Date(meetingGoal.startDate), `HH:mm ${CalendarUtils.timeFormat === '12-hour' ? 'A' : ''}`);
      const meetingLocation = ((_a = meetingGoal.location) === null || _a === void 0 ? void 0 : _a.type) === 'microsoftbusiness' ? 'Microsoft Teams' : `${((_c = (_b = meetingGoal.location) === null || _b === void 0 ? void 0 : _b.type) === null || _c === void 0 ? void 0 : _c.charAt(0).toUpperCase()) + ((_e = (_d = meetingGoal.location) === null || _d === void 0 ? void 0 : _d.type) === null || _e === void 0 ? void 0 : _e.slice(1))}`;
      return (h("div", { class: "d-flex justify-content-between align-items-center mt-2" }, h("div", { class: "d-flex meeting-data" }, h("div", { class: "meeting-date clickable", onClick: () => {
          this.action.emit({
            name: 'open-meeting-detail',
            data: {
              meeting: meetingGoal
            }
          });
        } }, h("span", { class: "day-and-month" }, meetingDayAndMonth)), h("div", { class: "flex-column ml-3" }, h("h4", null, sessionName), h("div", { class: "meeting-time" }, h("p", null, " ", day, " - ", startDate, " - ", directionBetweenDatesInMinutes, " minutes ")), h("div", { class: "d-flex align-items-center text-primary" }, meetingGoal.location.type === 'custom' || meetingGoal.location.type === undefined ?
        h("p", { class: "custom-address" }, " ", truncate(meetingGoal.location.address, 30), " ")
        :
          h("div", { class: "d-flex align-items-center" }, h("dvn-icon", { "icon-name": "uil uil-video", scale: "large", size: 20, class: "zero-margin-icon" }), h("a", { class: "ml-2", target: '_blank', href: meetingGoal.location.address }, " ", meetingLocation, " "))))), h("dvn-icon", { onClick: () => {
          this.action.emit({
            name: 'open-meeting-detail',
            data: {
              meeting: meetingGoal
            }
          });
        }, class: "clickable", "icon-name": "uil uil-angle-right-b", size: 35 })));
    };
    this.renderSessionEmptyDesign = (emptyGoal) => {
      const showMobileUI = this.size < ResponsiveSize.Medium;
      return (h("div", { class: "d-flex align-items-center mt-2" }, h("div", { class: "meeting-date" }, h("dvn-icon", { iconName: "uil uil-schedule", size: 35 })), h("div", { class: `d-flex justify-content-between ${showMobileUI ? 'flex-column' : 'align-items-center'}`, style: { width: showMobileUI ? 'auto' : '100%' } }, h("div", { class: "font-medium", style: { marginLeft: '16px' } }, h("h4", null, emptyGoal.name), h("p", { style: { color: 'var(--color-neutral)' } }, this.i18n.notScheduled)), h("div", { class: "d-flex align-items-center clickable", style: { marginLeft: '14px' }, onClick: () => {
          this.shownMeetingConfig = emptyGoal;
        } }, h("dvn-icon", { class: "zero-margin-icon mr-1", "icon-name": "uil uil-file-alt", size: showMobileUI ? 20 : 30, scale: "large" }), h("p", null, this.i18n.aboutThisSession)))));
    };
  }
  async invalidate(_event) {
    this.fetchMeetings();
  }
  ;
  componentDidLoad() {
    this.fetchMeetings();
  }
  async fetchMeetings() {
    var _a;
    const { pairConfig, userId, sessionUserId } = this;
    const response = await this.apiTakvim.getMeetingsOfUser((_a = pairConfig.calendarConfig) === null || _a === void 0 ? void 0 : _a._id, [sessionUserId, userId]);
    const meetingsByIdentifiers = {};
    response.results.forEach(meeting => {
      meetingsByIdentifiers[meeting.meetingType] = meeting;
    });
    this.meetingsByIdentifiers = meetingsByIdentifiers;
  }
  render() {
    const totalMeetingsGoalLength = this.pairConfig.structure.meetingConfigs.length || 0;
    const hasGoalMeetings = totalMeetingsGoalLength > 0;
    const finishedMeetingsGoalLength = Object.keys(this.meetingsByIdentifiers).length;
    const finishedMeetingsGoalPercent = calculateMeetingsPercent(totalMeetingsGoalLength, finishedMeetingsGoalLength, hasGoalMeetings);
    const meetingGoals = this.pairConfig.structure.meetingConfigs;
    const showMobileUI = this.size < ResponsiveSize.Medium;
    return (h(Host, { class: "mb-3" }, h("dvn-card", { leaned: true, elevation: 0, class: "mb-3" }, h("div", { class: `d-flex mb-4 ${showMobileUI ? 'flex-column justify-content-center' : 'justify-content-between align-items-center'}` }, h("div", { class: `d-flex align-items-center ${!showMobileUI ? 'justify-content-between' : ''}` }, h("dvn-linear-progress", { percent: finishedMeetingsGoalPercent, showPercent: true, tint: "secondary" }), h("p", { class: "ml-2", style: { color: 'var(--color-text-secondary)' } }, this.i18n.completed)), h("p", null, finishedMeetingsGoalLength, " ", finishedMeetingsGoalLength > 1 ? this.i18n.meetingsScheduled : this.i18n.meetingScheduled)), meetingGoals && meetingGoals.map((goalConfig, i) => {
      var _a;
      const renderCurrentMeetingGoal = this.meetingsByIdentifiers[goalConfig.id];
      const sessionName = (_a = meetingGoals.find(goal => goal.id === goalConfig.id)) === null || _a === void 0 ? void 0 : _a.name;
      const hasMeetingGoal = !!renderCurrentMeetingGoal;
      const displayBreakLine = i < (totalMeetingsGoalLength - 1);
      return (h("div", null, hasMeetingGoal ?
        this.renderHasSessionDesign(renderCurrentMeetingGoal, sessionName)
        :
          this.renderSessionEmptyDesign(goalConfig), displayBreakLine && h("hr", { class: "break-line" })));
    })), h("dvn-dialog", { title: this.shownMeetingConfig ? this.shownMeetingConfig.name : undefined, shown: !!this.shownMeetingConfig, onDismiss: () => this.shownMeetingConfig = undefined }, this.shownMeetingConfig &&
      h("dvn-markdown", { content: this.shownMeetingConfig.specifications[this.userRefFieldId].description }))));
  }
};
const truncate = (text, limit) => {
  if (text.length > limit) {
    return text.substring(0, limit) + '...';
  }
  return text;
};
const calculateMeetingsPercent = (meetingsGoalLength, finishedMeetingsGoalLength, hasGoalMeetings) => {
  if (!hasGoalMeetings) {
    return '0';
  }
  const result = Math.floor((finishedMeetingsGoalLength / meetingsGoalLength) * 100).toString();
  return result;
};
const getMinutesBetweenDates = (startDate, endDate) => {
  const diff = endDate.getTime() - startDate.getTime();
  return Math.round(diff / 60000);
};
AtamaStructuredPairSessionOverview.style = atamaStructuredPairSessionOverviewCss;

export { AtamaStructuredPairSessionOverview as atama_structured_pair_session_overview };
