Merged in fix/LOY-180-hide-filter-modal (pull request #1568)
fix(LOY-180): remove use of FilterRewardsModal * fix(LOY-180): remove use of FilterRewardsModal Approved-by: Christian Andolf
This commit is contained in:
@@ -11,18 +11,14 @@ import Pagination from "@/components/MyPages/Pagination"
|
|||||||
import ExpirationDate from "@/components/Rewards/ExpirationDate"
|
import ExpirationDate from "@/components/Rewards/ExpirationDate"
|
||||||
import Grids from "@/components/TempDesignSystem/Grids"
|
import Grids from "@/components/TempDesignSystem/Grids"
|
||||||
import Title from "@/components/TempDesignSystem/Text/Title"
|
import Title from "@/components/TempDesignSystem/Text/Title"
|
||||||
import { useFilteredRewards } from "@/hooks/rewards/useFilteredRewards"
|
|
||||||
import useLang from "@/hooks/useLang"
|
import useLang from "@/hooks/useLang"
|
||||||
import { getEarliestExpirationDate } from "@/utils/rewards"
|
import { getEarliestExpirationDate } from "@/utils/rewards"
|
||||||
|
|
||||||
import Redeem from "../Redeem"
|
import Redeem from "../Redeem"
|
||||||
import FilterRewardsModal from "./FilterRewardsModal"
|
|
||||||
|
|
||||||
import styles from "./current.module.css"
|
import styles from "./current.module.css"
|
||||||
|
|
||||||
import type { CurrentRewardsClientProps } from "@/types/components/myPages/myPage/accountPage"
|
import type { CurrentRewardsClientProps } from "@/types/components/myPages/myPage/accountPage"
|
||||||
import type { RewardCategory } from "@/types/components/myPages/rewards"
|
|
||||||
import type { MembershipLevelEnum } from "@/constants/membershipLevels"
|
|
||||||
import type {
|
import type {
|
||||||
Reward,
|
Reward,
|
||||||
RewardWithRedeem,
|
RewardWithRedeem,
|
||||||
@@ -36,12 +32,6 @@ export default function ClientCurrentRewards({
|
|||||||
const lang = useLang()
|
const lang = useLang()
|
||||||
const containerRef = useRef<HTMLDivElement>(null)
|
const containerRef = useRef<HTMLDivElement>(null)
|
||||||
const [currentPage, setCurrentPage] = useState(1)
|
const [currentPage, setCurrentPage] = useState(1)
|
||||||
const [selectedCategories, setSelectedCategories] = useState<
|
|
||||||
RewardCategory[]
|
|
||||||
>([])
|
|
||||||
const [selectedLevels, setSelectedLevels] = useState<MembershipLevelEnum[]>(
|
|
||||||
[]
|
|
||||||
)
|
|
||||||
|
|
||||||
const { data } = trpc.contentstack.rewards.current.useQuery<{
|
const { data } = trpc.contentstack.rewards.current.useQuery<{
|
||||||
rewards: (Reward | RewardWithRedeem)[]
|
rewards: (Reward | RewardWithRedeem)[]
|
||||||
@@ -54,36 +44,16 @@ export default function ClientCurrentRewards({
|
|||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
const {
|
|
||||||
filteredRewards,
|
|
||||||
total,
|
|
||||||
availableTierLevels,
|
|
||||||
availableCategories,
|
|
||||||
hasFilterableOptions,
|
|
||||||
} = useFilteredRewards(
|
|
||||||
data?.rewards ?? [],
|
|
||||||
selectedCategories,
|
|
||||||
selectedLevels
|
|
||||||
)
|
|
||||||
|
|
||||||
if (!data) {
|
if (!data) {
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleCategoriesChange(categories: RewardCategory[]) {
|
const rewards = data.rewards
|
||||||
setSelectedCategories(categories)
|
|
||||||
setCurrentPage(1)
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleLevelsChange(levels: MembershipLevelEnum[]) {
|
|
||||||
setSelectedLevels(levels)
|
|
||||||
setCurrentPage(1)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
const totalPages = Math.ceil(rewards.length / REWARDS_PER_PAGE)
|
||||||
const startIndex = (currentPage - 1) * REWARDS_PER_PAGE
|
const startIndex = (currentPage - 1) * REWARDS_PER_PAGE
|
||||||
const endIndex = startIndex + REWARDS_PER_PAGE
|
const endIndex = startIndex + REWARDS_PER_PAGE
|
||||||
const paginatedRewards = filteredRewards.slice(startIndex, endIndex)
|
const paginatedRewards = rewards.slice(startIndex, endIndex)
|
||||||
const totalPages = Math.ceil(total / REWARDS_PER_PAGE)
|
|
||||||
|
|
||||||
function handlePageChange(page: number) {
|
function handlePageChange(page: number) {
|
||||||
requestAnimationFrame(() => {
|
requestAnimationFrame(() => {
|
||||||
@@ -98,16 +68,6 @@ export default function ClientCurrentRewards({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div ref={containerRef} className={styles.container}>
|
<div ref={containerRef} className={styles.container}>
|
||||||
{showRedeem && hasFilterableOptions ? (
|
|
||||||
<FilterRewardsModal
|
|
||||||
selectedCategories={selectedCategories}
|
|
||||||
selectedLevels={selectedLevels}
|
|
||||||
availableCategories={availableCategories}
|
|
||||||
availableTierLevels={availableTierLevels}
|
|
||||||
onCategoriesChange={handleCategoriesChange}
|
|
||||||
onLevelsChange={handleLevelsChange}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
<Grids.Stackable>
|
<Grids.Stackable>
|
||||||
{paginatedRewards.map((reward, idx) => {
|
{paginatedRewards.map((reward, idx) => {
|
||||||
const earliestExpirationDate =
|
const earliestExpirationDate =
|
||||||
|
|||||||
Reference in New Issue
Block a user