Commit f096c953 authored by aleclofabbro's avatar aleclofabbro

Fixed folow|join button in previews sends you to related page, fixed with a...

Fixed folow|join button in previews sends you to related page, fixed with a programmatioc workaround ( preventDefault() ) - would be much better to solve it with HTML. finished also remainig checks for search items follow logics
parent 2a5ba56a
......@@ -68,13 +68,13 @@ export const SearchPageHOC = connectInfiniteHits(_SearchPageHOC);
const CollectionPreviewHit: React.FC<{ hit: CollectionHit }> = ({ hit }) => {
const isLocal = useIsLocal(hit);
const previewFragment = collectionHit2gql(hit, isLocal);
const toggleFollowFormik = useToggleFollowHitFormik(hit);
const { toggleFollowFormik } = useFollowHitHelper(hit);
const props =
previewFragment &&
collectionFragment2UIProps({
collection: previewFragment,
hideActions: false,
toggleFollowFormik: toggleFollowFormik
toggleFollowFormik
});
!props && console.warn(`Could not preview searchHit:`, hit);
// console.log(`Collection:`, props)
......@@ -84,14 +84,17 @@ const CollectionPreviewHit: React.FC<{ hit: CollectionHit }> = ({ hit }) => {
const CommunityPreviewHit: React.FC<{ hit: CommunityHit }> = ({ hit }) => {
const isLocal = useIsLocal(hit);
const previewFragment = communityHit2gql(hit, isLocal);
const toggleFollowFormik = useToggleFollowHitFormik(hit);
const {
toggleFollowFormik: toggleJoinFormik,
hitSearchFollow
} = useFollowHitHelper(hit);
const props =
previewFragment &&
communityFragment2UIProps({
community: previewFragment,
hideActions: false,
toggleJoinFormik: toggleFollowFormik,
isCreator: false //FIXME
toggleJoinFormik,
isCreator: !!hitSearchFollow?.isCreator
});
!props && console.warn(`Could not preview searchHit:`, hit);
// console.log(`Community:`, props)
......@@ -136,13 +139,13 @@ const useIsLocal = (hit: Hit) => {
// console.log(`---`)
return isLocal;
};
const useToggleFollowHitFormik = (hit: Hit) => {
const useFollowHitHelper = (hit: Hit) => {
const { data } = useSearchHostIndexAndMyFollowsQuery({
context: mnCtx({ noShowError: true })
});
const [follow, followResult] = useSearchFollowMutation();
const [unfollow, unfollowResult] = useSearchUnfollowMutation();
const myFollow = React.useMemo(
const hitSearchFollow = React.useMemo(
() =>
(data?.me?.searchFollows || []).find(
searchFollow => searchFollow.canonicalUrl === hit.canonicalUrl
......@@ -150,20 +153,34 @@ const useToggleFollowHitFormik = (hit: Hit) => {
[data, hit]
);
const canFollow = !hitSearchFollow?.followId;
const canUnfollow =
hitSearchFollow?.followId &&
!(hitSearchFollow.communityId && hitSearchFollow.isCreator);
const toggleFollowFormik = useFormik({
initialValues: {},
onSubmit: async () => {
if (!hit.canonicalUrl || followResult.loading || unfollowResult.loading) {
return;
}
return myFollow
? unfollow({
variables: {
contextId: myFollow.canonicalUrl /*FIXME with myFollow.followId */
}
})
: follow({ variables: { url: hit.canonicalUrl } });
if (hitSearchFollow && canUnfollow) {
return unfollow({
variables: {
contextId: hitSearchFollow.followId
}
});
} else if (canFollow) {
return follow({ variables: { url: hit.canonicalUrl } });
}
return;
}
});
return toggleFollowFormik;
return React.useMemo(
() => ({
toggleFollowFormik,
hitSearchFollow
}),
[toggleFollowFormik, hitSearchFollow]
);
};
......@@ -27,7 +27,7 @@ export type SearchMeFragment = (
{ __typename: 'Me' }
& { searchFollows: Array<(
{ __typename: 'SearchFollow' }
& Pick<Types.SearchFollow, 'canonicalUrl' | 'collectionId' | 'communityId'>
& Pick<Types.SearchFollow, 'canonicalUrl' | 'collectionId' | 'communityId' | 'followId' | 'isCreator'>
)> }
);
......@@ -65,6 +65,8 @@ export const SearchMeFragmentDoc = gql`
canonicalUrl
collectionId
communityId
followId
isCreator
}
}
`;
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -64,7 +64,10 @@ export const Collection: React.FC<Props> = ({
<ActionItem
bordered
isFollowing={isFollowing ? true : false}
onClick={toggleFollowFormik.submitForm}
onClick={e => {
e.preventDefault();
toggleFollowFormik.submitForm();
}}
>
<ActionText
ml={1}
......
......@@ -100,7 +100,10 @@ export const Community: React.FC<Props> = ({
variant="outline"
isDisabled={isCreator ? true : false}
isSubmitting={toggleJoinFormik.isSubmitting}
onClick={toggleJoinFormik.submitForm}
onClick={e => {
e.preventDefault();
toggleJoinFormik.submitForm();
}}
>
<Text variant={'suptitle'}>
{joined ? <Trans>Leave</Trans> : <Trans>Join</Trans>}
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment