import { useLoad, useShareAppMessage } from '@tarojs/taro';

import { useCallback } from 'react';

import HomePage from '@/components/home-page';
import SearchCity from '@/components/search-city';
import { PageType, PageUrl, RoleType } from '@/constants/app';
import { GROUPS } from '@/constants/group';
import useInviteCode from '@/hooks/use-invite-code';
import { switchRoleType } from '@/utils/app';
import { openCustomerServiceChat } from '@/utils/common';
import { getCurrentCityCode } from '@/utils/location';
import { getInviteCodeFromQueryAndUpdate } from '@/utils/partner';
import { getPageQuery } from '@/utils/route';
import { getCommonShareMessage } from '@/utils/share';
import { checkCityCode } from '@/utils/user';
import './index.less';

const PREFIX = 'group-v2-page';

export default function GroupV2() {
  const inviteCode = useInviteCode();

  useLoad(() => {
    switchRoleType(RoleType.Anchor);

    const query = getPageQuery();
    getInviteCodeFromQueryAndUpdate(query);
  });

  useShareAppMessage(() =>
    getCommonShareMessage({ inviteCode, title: '邀请你加入本地主播求职招聘群', path: PageUrl.GroupV2 })
  );

  const handleSelectCity = useCallback(cityCode => {
    if (!checkCityCode(cityCode)) {
      return;
    }
    const group = GROUPS.find(g => String(g.cityCode) === cityCode);
    if (group) {
      openCustomerServiceChat(group.serviceUrl);
    }
  }, []);

  return (
    <HomePage type={PageType.GroupV2}>
      <div className={PREFIX}>
        <SearchCity
          onSelectCity={handleSelectCity}
          currentCity={getCurrentCityCode()}
          forGroup
          offset={72}
          banner="点击城市加入本地主播招聘群，高薪职位早知道"
        />
      </div>
    </HomePage>
  );
}
