import { useMutation, useQuery } from "@apollo/client";
import React from "react";
import { logImEXEvent } from "../../firebase/firebase.utils";
import {
  QUERY_ALL_ASSOCIATIONS,
  UPDATE_ASSOCIATION,
} from "../../graphql/associations.queries";
import AlertComponent from "../alert/alert.component";
import ProfileShopsComponent from "./profile-shops.component";
import axios from "axios";
import { messaging } from "../../firebase/firebase.utils";
import { getToken } from "firebase/messaging";

import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(ProfileShopsContainer);

export function ProfileShopsContainer({ bodyshop }) {
  const { loading, error, data } = useQuery(QUERY_ALL_ASSOCIATIONS, {
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
  });
  const [updateAssocation] = useMutation(UPDATE_ASSOCIATION);

  const updateActiveShop = async (activeShopId) => {
    logImEXEvent("profile_change_active_shop");

    try {
      const fcm_tokens = await getToken(messaging);

      await axios.post("/notifications/unsubscribe", {
        fcm_tokens,
        imexshopid: bodyshop.imexshopid,
        type: "messaging",
      });
    } catch (error) {
      console.log("No FCM token. Skipping unsubscribe.");
    }
    await Promise.all(
      data.associations.map(async (record) => {
        await updateAssocation({
          variables: {
            assocId: record.id,
            assocActive: record.id === activeShopId ? true : false,
          },
        });
      })
    );

    //Force window refresh.

    window.location.reload();
  };

  if (error) return <AlertComponent type="error" message={error.message} />;
  return (
    <ProfileShopsComponent
      loading={loading}
      data={data ? data.associations : null}
      updateActiveShop={updateActiveShop}
    />
  );
}
