Add 7 follows to the progress guide
This commit is contained in:
@@ -18,7 +18,7 @@ import {ProgressGuideTask} from './Task'
|
|||||||
export function ProgressGuideList({style}: {style: StyleProp<ViewStyle>}) {
|
export function ProgressGuideList({style}: {style: StyleProp<ViewStyle>}) {
|
||||||
const t = useTheme()
|
const t = useTheme()
|
||||||
const {_} = useLingui()
|
const {_} = useLingui()
|
||||||
const guide = useProgressGuide(ProgressGuideName.Like10Posts)
|
const guide = useProgressGuide(ProgressGuideName.Like10AndFollow7)
|
||||||
const {captureAction, endProgressGuide} = useProgressGuideControls()
|
const {captureAction, endProgressGuide} = useProgressGuideControls()
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
@@ -26,7 +26,7 @@ export function ProgressGuideList({style}: {style: StyleProp<ViewStyle>}) {
|
|||||||
return () => clearInterval(i)
|
return () => clearInterval(i)
|
||||||
}, [captureAction])
|
}, [captureAction])
|
||||||
|
|
||||||
if (guide?.guide === ProgressGuideName.Like10Posts) {
|
if (guide?.guide === ProgressGuideName.Like10AndFollow7) {
|
||||||
return (
|
return (
|
||||||
<View style={[a.flex_col, a.gap_md, style]}>
|
<View style={[a.flex_col, a.gap_md, style]}>
|
||||||
<View style={[a.flex_row, a.align_center]}>
|
<View style={[a.flex_row, a.align_center]}>
|
||||||
@@ -43,7 +43,7 @@ export function ProgressGuideList({style}: {style: StyleProp<ViewStyle>}) {
|
|||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="tiny"
|
size="tiny"
|
||||||
color="secondary"
|
color="secondary"
|
||||||
label={_(msg`Dismiss get started`)}
|
label={_(msg`Dismiss getting started guide`)}
|
||||||
onPress={endProgressGuide}>
|
onPress={endProgressGuide}>
|
||||||
<ButtonIcon icon={Times} />
|
<ButtonIcon icon={Times} />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -54,6 +54,11 @@ export function ProgressGuideList({style}: {style: StyleProp<ViewStyle>}) {
|
|||||||
title={_(msg`Like 10 posts`)}
|
title={_(msg`Like 10 posts`)}
|
||||||
subtitle={_(msg`Teach Discover what you like.`)}
|
subtitle={_(msg`Teach Discover what you like.`)}
|
||||||
/>
|
/>
|
||||||
|
<ProgressGuideTask
|
||||||
|
current={guide.numFollows}
|
||||||
|
total={7}
|
||||||
|
title={_(msg`Follow 7 accounts`)}
|
||||||
|
/>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,10 +9,11 @@ import {
|
|||||||
|
|
||||||
export enum ProgressGuideAction {
|
export enum ProgressGuideAction {
|
||||||
Like = 'like',
|
Like = 'like',
|
||||||
|
Follow = 'follow',
|
||||||
}
|
}
|
||||||
|
|
||||||
export enum ProgressGuideName {
|
export enum ProgressGuideName {
|
||||||
Like10Posts = 'like-10-posts',
|
Like10AndFollow7 = 'like-10-and-follow-7',
|
||||||
}
|
}
|
||||||
|
|
||||||
interface BaseProgressGuide {
|
interface BaseProgressGuide {
|
||||||
@@ -20,12 +21,13 @@ interface BaseProgressGuide {
|
|||||||
isComplete: boolean
|
isComplete: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Like10PostsProgressGuide extends BaseProgressGuide {
|
interface Like10AndFollow7ProgressGuide extends BaseProgressGuide {
|
||||||
guide: ProgressGuideName.Like10Posts
|
guide: ProgressGuideName.Like10AndFollow7
|
||||||
numLikes: number
|
numLikes: number
|
||||||
|
numFollows: number
|
||||||
}
|
}
|
||||||
|
|
||||||
type ProgressGuide = Like10PostsProgressGuide | undefined
|
type ProgressGuide = Like10AndFollow7ProgressGuide | undefined
|
||||||
|
|
||||||
const ProgressGuideContext = React.createContext<ProgressGuide>(undefined)
|
const ProgressGuideContext = React.createContext<ProgressGuide>(undefined)
|
||||||
|
|
||||||
@@ -56,8 +58,9 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
|||||||
|
|
||||||
const [activeProgressGuide, setActiveProgressGuide] =
|
const [activeProgressGuide, setActiveProgressGuide] =
|
||||||
React.useState<ProgressGuide>({
|
React.useState<ProgressGuide>({
|
||||||
guide: ProgressGuideName.Like10Posts,
|
guide: ProgressGuideName.Like10AndFollow7,
|
||||||
numLikes: 0,
|
numLikes: 0,
|
||||||
|
numFollows: 0,
|
||||||
isComplete: false,
|
isComplete: false,
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -68,10 +71,11 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
|||||||
const controls = React.useMemo(() => {
|
const controls = React.useMemo(() => {
|
||||||
return {
|
return {
|
||||||
startProgressGuide(guide: ProgressGuideName) {
|
startProgressGuide(guide: ProgressGuideName) {
|
||||||
if (guide === ProgressGuideName.Like10Posts) {
|
if (guide === ProgressGuideName.Like10AndFollow7) {
|
||||||
setActiveProgressGuide({
|
setActiveProgressGuide({
|
||||||
guide: ProgressGuideName.Like10Posts,
|
guide: ProgressGuideName.Like10AndFollow7,
|
||||||
numLikes: 0,
|
numLikes: 0,
|
||||||
|
numFollows: 0,
|
||||||
isComplete: false,
|
isComplete: false,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@@ -86,7 +90,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
|||||||
if (guide?.isComplete) {
|
if (guide?.isComplete) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (guide?.guide === ProgressGuideName.Like10Posts) {
|
if (guide?.guide === ProgressGuideName.Like10AndFollow7) {
|
||||||
if (action === ProgressGuideAction.Like) {
|
if (action === ProgressGuideAction.Like) {
|
||||||
guide = {
|
guide = {
|
||||||
...guide,
|
...guide,
|
||||||
@@ -100,10 +104,19 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
|||||||
}
|
}
|
||||||
if (guide.numLikes === 10) {
|
if (guide.numLikes === 10) {
|
||||||
tenthLikeToastRef.current?.open()
|
tenthLikeToastRef.current?.open()
|
||||||
guide = {
|
}
|
||||||
...guide,
|
}
|
||||||
isComplete: true,
|
if (action === ProgressGuideAction.Follow) {
|
||||||
}
|
guide = {
|
||||||
|
...guide,
|
||||||
|
numFollows: (guide.numFollows || 0) + 1,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (guide.numLikes >= 10 && guide.numFollows >= 7) {
|
||||||
|
tenthLikeToastRef.current?.open()
|
||||||
|
guide = {
|
||||||
|
...guide,
|
||||||
|
isComplete: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user