124 lines
6.1 KiB
TypeScript
124 lines
6.1 KiB
TypeScript
// Metro module 14028 (f14029).
|
|
import { useCallback, useLayoutEffect } from "react";
|
|
import { View } from "react-native";
|
|
import { QuestHomeSortMethods } from "../QuestConstants";
|
|
import { AnalyticEvents } from "../../../Constants";
|
|
import { CollectiblesMobileShopScreen } from "../../collectibles/CollectiblesShopConstants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { QuestsIcon } from "../../../design/components/Icon/native/redesign/generated/QuestsIcon";
|
|
import { Heading } from "../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import { useFetchVirtualCurrencyBalance } from "../../virtual_currency/hooks/useFetchVirtualCurrencyBalance";
|
|
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
|
|
import AnalyticsUtils from "../../../utils/AnalyticsUtils";
|
|
import AnalyticsLocation from "../../app_analytics/AnalyticsLocation";
|
|
import { openCollectiblesShopMobile } from "../../collectibles/CollectiblesActionCreators";
|
|
import { BalanceWidgetPillButton } from "../../virtual_currency/native/index";
|
|
import { BaseIconButton } from "../../../design/components/Button/native/BaseIconButton.native";
|
|
import { FiltersHorizontalIcon } from "../../../design/components/Icon/native/redesign/generated/FiltersHorizontalIcon";
|
|
import { useNavigation } from "../../../design/components/Navigator/native/useNavigation.native";
|
|
import { useVirtualCurrencyMobileEnabled } from "../../virtual_currency/hooks/native/useVirtualCurrencyMobileEnabled";
|
|
let useStyles, QuestHomeHeaderRight, FiltersButton;
|
|
const QuestHomeHeaderTitle = function QuestHomeHeaderTitle() {
|
|
const styles = useStyles();
|
|
return <View style={styles.headerTitleContainer}>
|
|
<QuestsIcon size="md" color="icon-strong" />
|
|
<Heading variant="redesign/heading-18/bold" color="mobile-text-heading-primary" maxFontSizeMultiplier={2} lineClamp={1} style={styles.headerTitle}>
|
|
{intl.string(t.JALI2K)}
|
|
</Heading>
|
|
</View>;
|
|
};
|
|
QuestHomeHeaderRight = function QuestHomeHeaderRight(props) {
|
|
const { isVirtualCurrencyEnabled: _isVirtualCurrencyEnabled, ...props2 } = props;
|
|
let isVirtualCurrencyEnabled = props.isVirtualCurrencyEnabled;
|
|
const styles = useStyles();
|
|
const balance = useFetchVirtualCurrencyBalance().balance;
|
|
const callback = useCallback(() => {
|
|
ActionSheetActionCreators.openLazy(() => import("../../virtual_currency/native/BalanceWidgetActionSheet").then((result) => result.default), "BalanceWidgetActionSheet", {
|
|
balance,
|
|
primaryButtonConfig: {
|
|
buttonText: intl.string(t.WrzJBf),
|
|
onButtonPress: () => {
|
|
AnalyticsUtils.track(AnalyticEvents.ORB_BALANCE_ACTION_SHEET_ACTION, {
|
|
type: "GO_TO_SHOP",
|
|
source: AnalyticsLocation.QUEST_HOME_PAGE,
|
|
balance
|
|
});
|
|
ActionSheetActionCreators.hideActionSheet();
|
|
openCollectiblesShopMobile({
|
|
analyticsLocations: [AnalyticsLocation.COLLECTIBLES_SHOP],
|
|
analyticsSource: AnalyticsLocation.COLLECTIBLES_SHOP,
|
|
screen: CollectiblesMobileShopScreen.ORBS
|
|
});
|
|
}
|
|
},
|
|
secondaryButtonConfig: {
|
|
buttonText: intl.string(t["/g10LC"]),
|
|
onButtonPress: () => {
|
|
AnalyticsUtils.track(AnalyticEvents.ORB_BALANCE_ACTION_SHEET_ACTION, {
|
|
type: "GO_BACK",
|
|
source: AnalyticsLocation.QUEST_HOME_PAGE,
|
|
balance
|
|
});
|
|
ActionSheetActionCreators.hideActionSheet();
|
|
}
|
|
},
|
|
source: AnalyticsLocation.QUEST_HOME_PAGE
|
|
});
|
|
}, [balance]);
|
|
if (isVirtualCurrencyEnabled) {
|
|
isVirtualCurrencyEnabled = <BalanceWidgetPillButton balance={balance} onPress={callback} />;
|
|
}
|
|
return <View style={styles.headerRightContainer}>
|
|
{isVirtualCurrencyEnabled}
|
|
<FiltersButton {...props2} />
|
|
</View>;
|
|
};
|
|
FiltersButton = function FiltersButton(props) {
|
|
const { setSelectedSortMethod, setSelectedFilters, selectedFilters, selectedSortMethod } = props;
|
|
let r1 = selectedFilters.length > 0;
|
|
const SUGGESTED = QuestHomeSortMethods.SUGGESTED;
|
|
if (!r1) {
|
|
r1 = selectedSortMethod !== SUGGESTED;
|
|
}
|
|
return <BaseIconButton icon={<FiltersHorizontalIcon size="sm" color={r1 ? Module712.colors.WHITE : Module712.colors.INTERACTIVE_TEXT_DEFAULT} />} size="sm" variant={r1 ? "primary" : "tertiary"} onPress={useCallback(() => {
|
|
ActionSheetActionCreators.openLazy(import("./QuestHomeSortingFilteringBottomSheet"), "QuestHomeSortingFilteringBottomSheet", {
|
|
onSortMethodChange: setSelectedSortMethod,
|
|
onFiltersChange: setSelectedFilters,
|
|
initialSortMethod: selectedSortMethod,
|
|
initialFilters: selectedFilters
|
|
});
|
|
}, [setSelectedSortMethod, setSelectedFilters, selectedFilters, selectedSortMethod])} accessibilityLabel={intl.string(t.UdhTtk)} scaleAmountInPx={4} />;
|
|
};
|
|
useStyles = createStyles({
|
|
headerTitleContainer: {
|
|
width: "100%",
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
marginTop: Module712.space.PX_8,
|
|
paddingLeft: Module712.space.PX_8,
|
|
gap: Module712.space.PX_8
|
|
},
|
|
headerTitle: {
|
|
flexShrink: 1
|
|
},
|
|
headerRightContainer: {
|
|
flexDirection: "row",
|
|
justifyContent: "flex-end",
|
|
alignItems: "center",
|
|
gap: Module712.space.PX_8,
|
|
marginTop: Module712.space.PX_8
|
|
}
|
|
});
|
|
export default function useQuestHomeHeader({ setSelectedSortMethod: setSelectedSortMethod2, setSelectedFilters: setSelectedFilters2, selectedFilters: selectedFilters2, selectedSortMethod: selectedSortMethod2 }) {
|
|
const navigation = useNavigation();
|
|
const enabled = useVirtualCurrencyMobileEnabled().enabled;
|
|
useLayoutEffect(() => {
|
|
navigation.setOptions({
|
|
headerTitle: () => <QuestHomeHeaderTitle />,
|
|
headerRight: () => <QuestHomeHeaderRight isVirtualCurrencyEnabled={enabled} setSelectedSortMethod={setSelectedSortMethod2} setSelectedFilters={setSelectedFilters2} selectedFilters={selectedFilters2} selectedSortMethod={selectedSortMethod2} />
|
|
});
|
|
}, [navigation, enabled, setSelectedSortMethod2, setSelectedFilters2, selectedFilters2, selectedSortMethod2]);
|
|
};
|