'use strict';

var headerText = require('./headerText-2eeecf55.js');
var normalText = require('./normalText-7b937f11.js');
var TsIcon = require('./TsIcon.js');
var vue = require('vue');
var TsCalendar = require('./index-a0d54c85.js');
var TsEmptyState = require('./TsEmptyState.js');
var TsSessionCard = require('./TsSessionCard.js');
var index = require('./index-20a19b1b.js');
var TsButton = require('./TsButton.js');

var script$3 = {
    components: {
        TsHeaderText: headerText.script,
        TsNormalText: normalText.script,
        TsIcon: TsIcon["default"],
    },
    props: {
        tabIsActive: {
            type: Function,
            required: true,
        },
        accountType: {
            type: String,
            default: "",
        },
    },
    name: "TsSideBar",
    setup(props) {
        const tabs = vue.ref([]);
        const setRoutes = () => {
            tabs.value = [];
            tabs.value.push({
                name: "Home",
                path: "/",
                icon: "home",
                routeTag: "base",
            });
            if (props.accountType == "student") {
                tabs.value.push({
                    name: "Tutors",
                    path: "/tutors",
                    icon: "tutors",
                    routeTag: "tutors",
                });
            }
            tabs.value.push({
                name: "Sessions",
                path: "/sessions",
                icon: "sessions",
                routeTag: "sessions",
                icon_size: "lg:h-[17px] mdlg:h-[16px]",
            }, {
                name: "Questions",
                path: "/questions",
                icon: "questions",
                routeTag: "questions",
            });
        };
        vue.onMounted(() => {
            setRoutes();
        });
        vue.watch(props, () => {
            setRoutes();
        });
        const hoverTab = vue.ref("");
        return {
            hoverTab,
            tabs,
        };
    },
};

const _hoisted_1$3 = { class: "flex flex-row space-x-2 items-center" };
const _hoisted_2$3 = /*#__PURE__*/vue.createElementVNode("img", {
  src: "/images/logo.svg",
  class: "h-[22px]"
}, null, -1 /* HOISTED */);
const _hoisted_3$2 = /*#__PURE__*/vue.createTextVNode(" Tutor Stack ");
const _hoisted_4$2 = { class: "flex flex-col space-y-2 pt-6" };

function render$3(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ts_header_text = vue.resolveComponent("ts-header-text");
  const _component_ts_icon = vue.resolveComponent("ts-icon");
  const _component_ts_normal_text = vue.resolveComponent("ts-normal-text");
  const _component_router_link = vue.resolveComponent("router-link");

  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
    vue.createElementVNode("span", _hoisted_1$3, [
      _hoisted_2$3,
      vue.createVNode(_component_ts_header_text, null, {
        default: vue.withCtx(() => [
          _hoisted_3$2
        ]),
        _: 1 /* STABLE */
      })
    ]),
    vue.createElementVNode("div", _hoisted_4$2, [
      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($setup.tabs, (tab, index) => {
        return (vue.openBlock(), vue.createBlock(_component_router_link, {
          key: index,
          to: tab.path,
          onMouseover: $event => ($setup.hoverTab = tab.icon),
          onMouseleave: _cache[0] || (_cache[0] = $event => ($setup.hoverTab = '')),
          class: vue.normalizeClass(`flex flex-row py-2 items-center px-3 space-x-3 ${
        $setup.hoverTab == tab.icon || $props.tabIsActive(tab.routeTag)
          ? 'bg-fadedBackground '
          : ''
      } rounded`)
        }, {
          default: vue.withCtx(() => [
            vue.createVNode(_component_ts_icon, {
              name: 
          $setup.hoverTab == tab.icon || $props.tabIsActive(tab.routeTag)
            ? `${tab.icon}_active`
            : tab.icon
        ,
              "custom-class": ` ${
          tab.icon_size ? tab.icon_size : 'lg:h-[19px] mdlg:h-[19px]'
        } `
            }, null, 8 /* PROPS */, ["name", "custom-class"]),
            vue.createVNode(_component_ts_normal_text, {
              "custom-class": "pt-[2px]",
              color: `${
          $setup.hoverTab == tab.icon || $props.tabIsActive(tab.routeTag)
            ? 'text-headerText'
            : 'text-gray-400'
        } `
            }, {
              default: vue.withCtx(() => [
                vue.createTextVNode(vue.toDisplayString(tab.name), 1 /* TEXT */)
              ]),
              _: 2 /* DYNAMIC */
            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["color"])
          ]),
          _: 2 /* DYNAMIC */
        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["to", "onMouseover", "class"]))
      }), 128 /* KEYED_FRAGMENT */))
    ])
  ], 64 /* STABLE_FRAGMENT */))
}

script$3.render = render$3;
script$3.__file = "src/components/TsNavigation/sideBar.vue";

var script$2 = {
    components: {
        TsHeaderText: headerText.script,
        TsNormalText: normalText.script,
        TsCalendar: TsCalendar.script,
        TsSessionCard: TsSessionCard["default"],
        TsEmptyState: TsEmptyState["default"],
    },
    props: {
        accountType: {
            type: String,
            default: "student",
        },
    },
    name: "TsCalendarBar",
    setup() {
        const SessionsByMonth = vue.ref();
        const selectedDate = vue.ref();
        vue.onMounted(() => {
            index.Logic.sessions.sessions.watchProperty("SessionsByMonth", SessionsByMonth);
            selectedDate.value = TsCalendar.moment(new Date());
        });
        const getSessionStatus = (session) => {
            if (session.paid.length == session.students.length &&
                TsCalendar.moment(session.startedAt + 60 * session.lengthInMinutes).isSameOrAfter(TsCalendar.moment.now())) {
                return ["upcoming", "yellow"];
            }
            else if (session.paid.length < session.students.length &&
                TsCalendar.moment(session.startedAt + 60 * session.lengthInMinutes).isSameOrAfter(TsCalendar.moment.now())) {
                return ["pending", "red"];
            }
            else if (!TsCalendar.moment(session.startedAt + 60 * session.lengthInMinutes).isSameOrAfter(TsCalendar.moment.now())) {
                return ["previous", "gray"];
            }
            else {
                return ["previous", "gray"];
            }
        };
        const setSelectedDate = (date) => {
            selectedDate.value = TsCalendar.moment(date);
        };
        return {
            SessionsByMonth,
            getSessionStatus,
            selectedDate,
            setSelectedDate,
        };
    },
};

const _hoisted_1$2 = { class: "w-full flex flex-row justify-between items-center pt-3" };
const _hoisted_2$2 = /*#__PURE__*/vue.createTextVNode(" Upcoming sessions ");
const _hoisted_3$1 = /*#__PURE__*/vue.createTextVNode("View all");
const _hoisted_4$1 = { class: "w-full flex flex-row justify-between items-center pt-3" };
const _hoisted_5$1 = {
  key: 0,
  class: "w-full flex flex-col space-y-3 pt-3"
};
const _hoisted_6 = /*#__PURE__*/vue.createTextVNode(" No sessions here ");
const _hoisted_7 = /*#__PURE__*/vue.createTextVNode(" Book sessions with your tutors, alone or with friends. ");
const _hoisted_8 = /*#__PURE__*/vue.createTextVNode(" My tutors ");

function render$2(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ts_header_text = vue.resolveComponent("ts-header-text");
  const _component_ts_normal_text = vue.resolveComponent("ts-normal-text");
  const _component_ts_calendar = vue.resolveComponent("ts-calendar");
  const _component_ts_session_card = vue.resolveComponent("ts-session-card");
  const _component_ts_empty_state = vue.resolveComponent("ts-empty-state");

  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
    vue.createElementVNode("div", _hoisted_1$2, [
      vue.createVNode(_component_ts_header_text, { size: "lg" }, {
        default: vue.withCtx(() => [
          _hoisted_2$2
        ]),
        _: 1 /* STABLE */
      }),
      vue.createElementVNode("div", null, [
        vue.createVNode(_component_ts_normal_text, { color: "text-primaryPurple" }, {
          default: vue.withCtx(() => [
            _hoisted_3$1
          ]),
          _: 1 /* STABLE */
        })
      ])
    ]),
    vue.createVNode(_component_ts_calendar, {
      accountType: $props.accountType,
      onOnDateSelected: $setup.setSelectedDate
    }, null, 8 /* PROPS */, ["accountType", "onOnDateSelected"]),
    vue.createElementVNode("div", _hoisted_4$1, [
      vue.createVNode(_component_ts_normal_text, null, {
        default: vue.withCtx(() => [
          vue.createTextVNode(vue.toDisplayString($setup.selectedDate?.format("dddd, MMM D, YYYY")), 1 /* TEXT */)
        ]),
        _: 1 /* STABLE */
      })
    ]),
    ($setup.SessionsByMonth?.results && $setup.SessionsByMonth.results.length > 0)
      ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$1, [
          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($setup.SessionsByMonth.results, (session, index) => {
            return (vue.openBlock(), vue.createBlock(_component_ts_session_card, {
              "show-button": false,
              "avatar-url": session.tutor.bio.photo?.link || '',
              status: $setup.getSessionStatus(session)[0],
              "badge-color": `${session.students.length == 1 ? 'purple' : 'green'}`,
              "card-linecolor": $setup.getSessionStatus(session)[1],
              "session-is-close": false,
              key: index,
              data: session
            }, null, 8 /* PROPS */, ["avatar-url", "status", "badge-color", "card-linecolor", "data"]))
          }), 128 /* KEYED_FRAGMENT */))
        ]))
      : (vue.openBlock(), vue.createBlock(_component_ts_empty_state, {
          key: 1,
          avatarUrl: '/images/no-session.svg',
          avatarSize: 'h-[60px]',
          ctaUrl: '/tutors',
          customClass: 'h-[300px] mdlg:!h-[280px] mt-4 border-[1px] rounded border-gray-200'
        }, {
          title: vue.withCtx(() => [
            _hoisted_6
          ]),
          subtext: vue.withCtx(() => [
            _hoisted_7
          ]),
          "cta-text": vue.withCtx(() => [
            _hoisted_8
          ]),
          _: 1 /* STABLE */
        }, 8 /* PROPS */, ["avatarUrl"]))
  ], 64 /* STABLE_FRAGMENT */))
}

script$2.render = render$2;
script$2.__file = "src/components/TsNavigation/calendarBar.vue";

var script$1 = {
    components: {
        TsIcon: TsIcon["default"],
        TsHeaderText: headerText.script,
    },
    props: {
        options: {
            required: true,
        },
        goBack: {
            type: Function,
            required: true,
        },
        goToRoute: {
            type: Function,
            required: true,
        },
    },
    emits: ["update:selectedTab"],
    name: "TsTopBar",
    setup(props, context) {
        const selectedTab = vue.ref("");
        const showMobileSearch = vue.ref(false);
        const selectDefaultTab = () => {
            if (props.options.type == "switch") {
                if (props.options.switchItems) {
                    selectedTab.value = props.options.switchItems[0]?.key;
                }
            }
        };
        const loadingState = vue.ref(false);
        vue.onMounted(() => {
            selectDefaultTab();
            index.Logic.common.watchProperty("loadingState", loadingState);
        });
        vue.watch(props.options, () => {
            selectDefaultTab();
        });
        vue.watch(selectedTab, () => {
            context.emit("update:selectedTab", selectedTab.value);
        });
        return {
            selectedTab,
            showMobileSearch,
            loadingState,
        };
    },
};

const _hoisted_1$1 = {
  key: 0,
  class: "loader z-[45666664999998]"
};
const _hoisted_2$1 = /*#__PURE__*/vue.createElementVNode("div", { class: "bar" }, null, -1 /* HOISTED */);
const _hoisted_3 = [
  _hoisted_2$1
];
const _hoisted_4 = /*#__PURE__*/vue.createElementVNode("input", {
  type: "text",
  class: "w-[200px] focus:outline-none border-none placeholder-slate-600",
  placeholder: "Search"
}, null, -1 /* HOISTED */);
const _hoisted_5 = {
  key: 1,
  type: "text",
  class: "w-full focus:outline-none border-none inline-block mdlg:hidden placeholder-slate-600",
  placeholder: "Search"
};

function render$1(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ts_icon = vue.resolveComponent("ts-icon");
  const _component_ts_header_text = vue.resolveComponent("ts-header-text");

  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
    ($setup.loadingState)
      ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, _hoisted_3))
      : vue.createCommentVNode("v-if", true),
    vue.createElementVNode("div", {
      class: vue.normalizeClass(`flex w-full  py-0 z-[5699] justify-between mdlg:px-0 px-0 sticky mdlg:pt-2 top-0 bg-white border-b-[1px] 
	${
    $props.options.type == 'basic' || !$setup.showMobileSearch
      ? ' flex-row items-center '
      : 'mdlg:!flex-row lg:!flex-row flex-col mdlg:!items-center lg:!items-center '
  } border-gray-200
  ${!$props.options.showBottomBorder ? 'mdlg:border-none' : 'mdlg:border-b-[1px]'}
  ${
    $props.options.type != 'basic' && $props.options.type != 'subpage'
      ? 'px-0'
      : 'mdlg:!px-0 px-3'
  }
  ${$props.options.type == 'subpage' ? 'mdlg:!border-none' : ''}`)
    }, [
      ($props.options.type == 'basic' || $props.options.type == 'subpage')
        ? (vue.openBlock(), vue.createBlock(_component_ts_header_text, {
            key: 0,
            size: "xl",
            "custom-class": ` py-3 lg:py-3 mdlg:py-4  flex flex-row items-center lg:pt-6 ${
        $props.options.type == 'subpage' || $props.options.showTitle ? '' : 'mdlg:hidden'
      }`
          }, {
            default: vue.withCtx(() => [
              ($props.options.type == 'subpage')
                ? (vue.openBlock(), vue.createBlock(_component_ts_icon, {
                    key: 0,
                    name: 'chevron-left',
                    onClick: _cache[0] || (_cache[0] = $event => ($props.goBack())),
                    "custom-class": "h-[12px] pr-[10px] cursor-pointer"
                  }))
                : vue.createCommentVNode("v-if", true),
              vue.createTextVNode(" " + vue.toDisplayString($props.options.pageTitle), 1 /* TEXT */)
            ]),
            _: 1 /* STABLE */
          }, 8 /* PROPS */, ["custom-class"]))
        : (vue.openBlock(), vue.createElementBlock("div", {
            key: 1,
            class: vue.normalizeClass(` ${
        $setup.showMobileSearch
          ? ' border-b-[1px]  border-gray-200 mdlg:!border-none'
          : ''
      } flex flex-row items-center space-x-3 mdlg:!space-x-5 mdlg:!px-0 `)
          }, [
            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.options.switchItems, (item, index) => {
              return (vue.openBlock(), vue.createBlock(_component_ts_header_text, {
                size: "xl",
                key: index,
                onClick: vue.withModifiers($event => ($setup.selectedTab = item.key), ["stop"]),
                "custom-class": ` mdlg:border-b-[3px] border-b-[1.5px] px-3 mdlg:px-0 cursor-pointer ${
          $setup.selectedTab == item.key
            ? ' border-headerText '
            : 'border-transparent '
        }   py-3 lg:!pb-2 mdlg:py-3 lg:pt-6`,
                color: `${
          $setup.selectedTab == item.key
            ? ' text-headerText'
            : 'text-headerText opacity-40'
        }`
              }, {
                default: vue.withCtx(() => [
                  vue.createTextVNode(vue.toDisplayString(item.value), 1 /* TEXT */)
                ]),
                _: 2 /* DYNAMIC */
              }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "custom-class", "color"]))
            }), 128 /* KEYED_FRAGMENT */))
          ], 2 /* CLASS */)),
      ($props.options.type != 'subpage')
        ? (vue.openBlock(), vue.createElementBlock("div", {
            key: 2,
            class: vue.normalizeClass(`hidden  items-center space-x-3 flex-grow mdlg:flex py-3  lg:pt-6 lg:py-3 mdlg:py-5 ${
        $props.options.type == 'basic' && !$props.options.showTitle
          ? 'flex-row'
          : 'flex-row-reverse'
      }`)
          }, [
            vue.createVNode(_component_ts_icon, {
              name: "search",
              "custom-class": "h-[17px]"
            }),
            _hoisted_4
          ], 2 /* CLASS */))
        : vue.createCommentVNode("v-if", true),
      ($props.options.type != 'subpage')
        ? (vue.openBlock(), vue.createElementBlock("div", {
            key: 3,
            class: vue.normalizeClass(` ${
        $props.options.type == 'basic' ? '' : 'px-3 mdlg:!px-0'
      } space-x-5 flex flex-row items-center py-3 lg:py-3 lg:pt-6 mdlg:py-5`)
          }, [
            vue.createVNode(_component_ts_icon, {
              name: "search",
              "custom-class": "mdlg:h-[17px] h-[17px] inline-block mdlg:hidden"
            }),
            ($props.options.hasNotification)
              ? (vue.openBlock(), vue.createBlock(_component_ts_icon, {
                  key: 0,
                  name: "bell",
                  onClick: _cache[1] || (_cache[1] = $event => ($props.goToRoute('/notifications'))),
                  "custom-class": "mdlg:h-[19px] h-[18px] cursor-pointer"
                }))
              : vue.createCommentVNode("v-if", true),
            ($setup.showMobileSearch)
              ? (vue.openBlock(), vue.createElementBlock("input", _hoisted_5))
              : vue.createCommentVNode("v-if", true)
          ], 2 /* CLASS */))
        : vue.createCommentVNode("v-if", true)
    ], 2 /* CLASS */)
  ], 64 /* STABLE_FRAGMENT */))
}

script$1.render = render$1;
script$1.__file = "src/components/TsNavigation/topBar.vue";

var script = vue.defineComponent({
    components: {
        TsIcon: TsIcon["default"],
        TsButton: TsButton["default"],
    },
    props: {
        tabIsActive: {
            type: Function,
            required: true,
        },
        options: {
            required: false,
        },
        accountType: {
            type: String,
            default: "student",
        },
    },
    name: "TsBottomBar",
    setup(props) {
        const tabs = vue.ref([]);
        const setRoutes = () => {
            tabs.value = [];
            tabs.value.push({
                path: "/",
                icon: "home",
                routeTag: "base",
            });
            if (props.accountType == "student") {
                tabs.value.push({
                    path: "/tutors",
                    icon: "tutors",
                    routeTag: "tutors",
                });
            }
            tabs.value.push({
                path: "/sessions",
                icon: "sessions",
                routeTag: "sessions",
                icon_size: "h-[17px]",
            }, {
                path: "/questions",
                icon: "questions",
                routeTag: "questions",
            }, {
                path: props.accountType == "student"
                    ? "/profile"
                    : "/tutors/" + index.Logic.auth.user.AuthUser?.id,
                icon: "profile",
                routeTag: "profile",
            });
        };
        const hoverTab = vue.ref("");
        vue.watch(props, () => {
            setRoutes();
        });
        vue.onMounted(() => {
            setRoutes();
        });
        return {
            hoverTab,
            tabs,
        };
    },
});

const _hoisted_1 = { class: "flex flex-col items-center py-2 z-50 w-full justify-center mdlg:hidden px-3 fixed left-0 bottom-0 bg-white border-t-[1px] border-gray-200" };
const _hoisted_2 = {
  key: 1,
  class: "w-full flex flex-row items-center space-x-2 justify-end"
};

function render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ts_icon = vue.resolveComponent("ts-icon");
  const _component_router_link = vue.resolveComponent("router-link");
  const _component_ts_button = vue.resolveComponent("ts-button");

  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
    (!_ctx.options.subPage)
      ? (vue.openBlock(), vue.createElementBlock("div", {
          key: 0,
          class: vue.normalizeClass(`w-full grid ${
          _ctx.tabs.length == 5 ? 'grid-cols-10' : 'grid-cols-8'
        }  gap-1 py-2`)
        }, [
          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tabs, (tab, index) => {
            return (vue.openBlock(), vue.createBlock(_component_router_link, {
              key: index,
              to: tab.path,
              class: "col-span-2 flex flex-row items-center justify-center"
            }, {
              default: vue.withCtx(() => [
                vue.createVNode(_component_ts_icon, {
                  name: 
              _ctx.hoverTab == tab.icon || _ctx.tabIsActive(tab.routeTag)
                ? `${tab.icon}_active`
                : tab.icon
            ,
                  "custom-class": ` ${
              tab.icon_size ? tab.icon_size : 'lg:h-[19px] mdlg:h-[17px]'
            } `
                }, null, 8 /* PROPS */, ["name", "custom-class"])
              ]),
              _: 2 /* DYNAMIC */
            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["to"]))
          }), 128 /* KEYED_FRAGMENT */))
        ], 2 /* CLASS */))
      : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options.actions, (action, index) => {
            return (vue.openBlock(), vue.createBlock(_component_ts_button, {
              key: index,
              onClick: $event => (action.action()),
              customClass: `${
            action.outlined ? 'border-[2px]  border-primaryPurple' : ''
          }`,
              bgColor: `${action.outlined ? 'bg-white' : 'bg-primaryPurple'}`,
              padding: 'px-4 py-2'
            }, {
              default: vue.withCtx(() => [
                vue.createTextVNode(vue.toDisplayString(action.label), 1 /* TEXT */)
              ]),
              _: 2 /* DYNAMIC */
            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick", "customClass", "bgColor"]))
          }), 128 /* KEYED_FRAGMENT */))
        ]))
  ]))
}

script.render = render;
script.__file = "src/components/TsNavigation/bottomBar.vue";

exports.script = script$3;
exports.script$1 = script$2;
exports.script$2 = script$1;
exports.script$3 = script;
