<template>
  <TemplateContainer size="l" class="homepage-main-content">
    <TwoColumnsLayout
      :separator="false"
      columns-template="3fr 2fr"
      class="homepage-banner mt-xxl"
    >
      <template #main>
        <HomeNewsSlider />
      </template>

      <template #sidebar>
        <div class="tools-weather-container">
          <ShortcutsListing />

          <HomeWeatherWithData />
        </div>
      </template>
    </TwoColumnsLayout>

    <HomeNewsListing />

    <TwoColumnsLayout
      :separator="false"
      columns-template="1fr 1fr"
      class="mt-3xl"
    >
      <template #left>
        <HomeCommunicationWithData />
      </template>

      <template #right>
        <HomeBlockImage />
      </template>
    </TwoColumnsLayout>

    <HomeJobsListing />

    <TwoColumnsLayout
      :separator="false"
      columns-template="1fr 1fr"
      class="mt-3xl"
    >
      <template #left>
        <HomeEventsListing />
      </template>

      <template #right>
        <HomeSocialBlockWithData />
      </template>
    </TwoColumnsLayout>
  </TemplateContainer>
</template>

<script>
import TemplateContainer from '@inside-commons/components/lib/TemplateContainer'
import TwoColumnsLayout from '@inside-commons/components/lib/TwoColumnsLayout'

import ShortcutsListing from '@inside-users/components/lib/ShortcutsListing'

import HomeEventsListing from '@inside-events/components/lib/EventsListingBlock'

import HomeNewsSlider from '../components/home/HomeNewsSlider'
import HomeWeather from '../components/home/HomeWeather'
import HomeNewsListing from '../components/home/HomeNewsListing'
import HomeCommunication from '../components/home/HomeCommunication'
import HomeBlockImage from '../components/home/HomeBlockImage'
import HomeJobsListing from '../components/home/HomeJobsListing'
import HomeSocialBlock from '../components/home/HomeSocialBlock'

import { withFetch } from 'inside-collection/hocs'
import {
  fetchWeather,
  fetchCommunication,
  fetchSocialBlock
} from '../components/home/homepage'

export default {
  name: 'HomePage',
  $_i18nRootPath: 'customs.HOMEPAGE',
  components: {
    TemplateContainer,
    TwoColumnsLayout,
    HomeNewsSlider,
    ShortcutsListing,
    HomeWeatherWithData: withFetch(HomeWeather)(fetchWeather),
    HomeNewsListing,
    HomeCommunicationWithData: withFetch(HomeCommunication)(fetchCommunication),
    HomeSocialBlockWithData: withFetch(HomeSocialBlock)(fetchSocialBlock),
    HomeBlockImage,
    HomeJobsListing,
    HomeEventsListing
  }
}
</script>
