@25sprout/react-starter/template/src/models/banner.js

25sprout web starter with React

import { createAction, handleActions } from 'redux-actions';
import { useRedux } from 'util/hook/redux';
import { customApi } from 'util/api';

export const getBanners = createAction('GET_BANNERS', async () => {
	try {
		const FEATURE_STORAGE_DOMAIN =
			'https://25sprout-backstagefeatures-sit.25demo.com/backstage/storage';
		const { bsxfeatureV1BannerList } = customApi;
		const { data } = await bsxfeatureV1BannerList({ secure: true });

		const result = data?.data?.map(list => {
			if (list.youtubeLink?.length === 0) {
				return {
					...list,
					youtubeLink: null,
					imageMobile: `${FEATURE_STORAGE_DOMAIN}/${list.imageMobile}`,
				};
			}

			return {
				...list,
				imageMobile: `${FEATURE_STORAGE_DOMAIN}/${list.imageMobile}`,
			};
		});

		return result;
	} catch (e) {
		return { list: [] };
	}
});

export const defaultState = {
	loading: false,
	banners: [],
};

export const reducer = {
	banners: handleActions(
		{
			GET_BANNERS_PENDING: state => ({
				...state,
				loading: true,
			}),

			GET_BANNERS_FULFILLED: (state, action) => ({
				...state,
				banners: action.payload,
				loading: false,
			}),
		},
		defaultState,
	),
};

const mapHooksToState = state => ({
	banners: state.banners.banners,
});

export const useBanner = () => useRedux(mapHooksToState, { getBanners });