Skip to content

Commit

Permalink
bugfix for PostChip links, simplyify ConnectionField, enable Custom P…
Browse files Browse the repository at this point in the history
…ost Type Connections
  • Loading branch information
zdmc23 committed Apr 30, 2022
1 parent 08408c3 commit 76ffd12
Show file tree
Hide file tree
Showing 7 changed files with 81 additions and 190 deletions.
181 changes: 18 additions & 163 deletions components/Field/Connection/ConnectionField.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,6 @@ import Select from "components/Select";
import PostChip from "components/Post/PostChip";
import SheetHeader from "components/Sheet/SheetHeader";
import ConnectionSheet from "./ConnectionSheet";
import UsersContactsSheet from "./UsersContactsSheet";
import GroupsSheet from "./GroupsSheet";
import PeopleGroupsSheet from "./PeopleGroupsSheet";
import TrainingsSheet from "./TrainingsSheet";

import useBottomSheet from "hooks/use-bottom-sheet";
import useStyles from "hooks/use-styles";
Expand All @@ -23,15 +19,19 @@ import {
baptizeIcon,
} from "constants/icons";

import { FieldNames, TabScreenConstants, ScreenConstants } from "constants";
import {
ScreenConstants,
TabScreenConstants,
TypeConstants
} from "constants";

import { localStyles } from "./ConnectionField.styles";

const ConnectionField = ({ editing, field, value, onChange }) => {

const { styles, globalStyles } = useStyles(localStyles);
const { expand } = useBottomSheet();
const { isPost, isContact, isGroup, getPostTypeByFieldName } = useType();
const { isPost, getPostTypeByField } = useType();

// VALUES
const values = value?.values || [];
Expand All @@ -43,128 +43,13 @@ const ConnectionField = ({ editing, field, value, onChange }) => {
);
};

const renderItemEdit = (item) => <PostChip id={item?.value} title={item?.name} type={getPostTypeByFieldName(field?.name)} onRemove={onRemove} />;
const renderItemView = (item) => <PostChip id={item?.value} title={item?.name} type={getPostTypeByFieldName(field?.name)} />;
const renderItemEdit = (item) => <PostChip id={item?.value} title={item?.name} type={getPostTypeByField(field)} onRemove={onRemove} />;
const renderItemView = (item) => <PostChip id={item?.value} title={item?.name} type={getPostTypeByField(field)} />;
const renderItemLinkless = (item) => <PostChip id={item?.value} title={item?.name} onRemove={onRemove} />;

const PeopleGroupEdit = () => (
<Select
onOpen={() => {
expand({
defaultIndex: 3,
renderHeader: () => (
<SheetHeader
expandable
dismissable
title={field?.label || ''}
/>
),
renderContent: () => (
<PeopleGroupsSheet
values={values}
onChange={onChange}
/>
)
});
}}
items={values}
renderItem={renderItemLinkless}
/>
);

const PostEdit = () => {
const route = useRoute();
return(
<Select
onOpen={() => {
expand({
defaultIndex: 3,
renderHeader: () => (
<SheetHeader
expandable
dismissable
title={field?.label || ''}
/>
),
renderContent: () =>
<ConnectionSheet
id={route?.params?.id}
fieldName={field?.name}
values={values}
onChange={onChange}
/>
});
}}
items={values}
renderItem={renderItemEdit}
//style={style}
//optionStyle={optionStyle}
/>
);
};

const ContactEdit = () => {
const route = useRoute();
return(
<Select
onOpen={() => {
expand({
defaultIndex: 3,
renderHeader: () => (
<SheetHeader
expandable
dismissable
title={field?.label || ''}
/>
),
renderContent: () =>
<UsersContactsSheet
id={route?.params?.id}
values={values}
onChange={onChange}
/>
});
}}
items={values}
renderItem={renderItemEdit}
//style={style}
//optionStyle={optionStyle}
/>
);
};

const GroupEdit = () => {
const route = useRoute();
return(
<Select
onOpen={() => {
expand({
defaultIndex: 3,
renderHeader: () => (
<SheetHeader
expandable
dismissable
title={field?.label || ''}
/>
),
renderContent: () =>
<GroupsSheet
id={route?.params?.id}
values={values}
onChange={onChange}
/>
});
}}
items={values}
renderItem={renderItemEdit}
//style={style}
//optionStyle={optionStyle}
/>
);
};

const TrainingEdit = () => {
const PostEdit = ({ linkless }) => {
const route = useRoute();
const type = getPostTypeByField(field);
return(
<Select
onOpen={() => {
Expand All @@ -178,29 +63,23 @@ const ConnectionField = ({ editing, field, value, onChange }) => {
/>
),
renderContent: () => (
<TrainingsSheet
<ConnectionSheet
id={route?.params?.id}
type={type}
values={values}
onChange={onChange}
/>
)
});
}}
items={values}
renderItem={renderItemEdit}
renderItem={linkless ? renderItemLinkless : renderItemEdit}
//style={style}
//optionStyle={optionStyle}
/>
);
};

const PeopleGroupView = () => (
<Select
items={values}
renderItem={renderItemView}
/>
);

const GroupView = () => {
const navigation = useNavigation();
return (
Expand Down Expand Up @@ -270,45 +149,21 @@ const ConnectionField = ({ editing, field, value, onChange }) => {
/>
);

const isPeopleGroupField = () => (
field?.name === FieldNames.PEOPLE_GROUPS
);

const isGroupField = () => (
field?.name === FieldNames.GROUPS ||
field?.name === FieldNames.PARENT_GROUPS ||
field?.name === FieldNames.PEER_GROUPS ||
field?.name === FieldNames.CHILD_GROUPS
);

const isContactField = () => (
field?.name === FieldNames.COACHES ||
field?.name === FieldNames.MEMBERS
);

const isTrainingField = () => (
field?.name === FieldNames.TRAININGS
);

const ConnectionFieldEdit = () => {
if (isContactField()) return <ContactEdit />;
if (isPeopleGroupField()) return <PeopleGroupEdit />;
if (isGroupField()) return <GroupEdit />;
if (isTrainingField()) return <TrainingEdit />;
if (isContact) return <ContactEdit />;
if (isGroup) return <GroupEdit />;
const postType = getPostTypeByField(field);
if (postType === TypeConstants.PEOPLE_GROUP) return <PostEdit linkless />;
if (isPost) return <PostEdit />;
return null;
};

const ConnectionFieldView = () => {
if (isPeopleGroupField()) return <PeopleGroupView />;
if (isGroupField()) return <GroupView />;
const postType = getPostTypeByField(field);
if (postType === TypeConstants.GROUP) return <GroupView />;
if (isPost) return <PostView />;
return null;
};

if (editing) return <ConnectionFieldEdit />;
return <ConnectionFieldView />;
};
export default ConnectionField;
export default ConnectionField;
14 changes: 12 additions & 2 deletions components/Field/Connection/ConnectionSheet.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,16 +5,26 @@ import { CheckIcon, MaterialCommunityIcon } from "components/Icon";
import FilterList from "components/FilterList";

import useBottomSheet from "hooks/use-bottom-sheet";
import useFilter from "hooks/use-filter";
import useList from "hooks/use-list";
import useStyles from "hooks/use-styles";

import { localStyles } from "./ConnectionSheet.styles";

const ConnectionSheet = ({ items, renderItem, values, onChange, search, onSearch }) => {
const ConnectionSheet = ({ id, type, renderItem, values, onChange }) => {

const { styles, globalStyles } = useStyles(localStyles);
const { delayedClose } = useBottomSheet();

if (!items) return null;
const { search, onSearch } = useFilter();

// exclude currently selected values from options list
const exclude = values?.map(item => item?.value);
// exclude the the current post (ie, contact or group)
if (id) exclude.push(id);

const { data: items } = useList({ search, exclude, type });
if (!items) return [];

// MAP TO API
const mapToAPI = (newItem) => {
Expand Down
27 changes: 9 additions & 18 deletions components/Field/UserSelect/UserSelectField.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,11 @@ const UserSelectField = ({ editing, field, value, onChange }) => {

const { delayedClose, expand } = useBottomSheet();

// SELECTED
const selectedLabel = value?.label ?? '';

const onRemove = () => onChange(null, { autosave: true });

const renderItemEdit = (item) => <PostChip id={item?.key} title={item?.label} type={TypeConstants.CONTACT} onRemove={onRemove} />;
//const renderItemEdit = (item) => <PostChip id={item?.key} title={item?.label} type={TypeConstants.CONTACT} onRemove={onRemove} />;
const renderItemEdit = (item) => <PostChip id={item?.key} title={item?.label} type={null} onRemove={onRemove} />;
const renderItemView = (item) => <PostChip id={item?.key} title={item?.label} />;

// EDIT MODE
const UserSelectFieldEdit = () => {
Expand All @@ -37,18 +36,6 @@ const UserSelectField = ({ editing, field, value, onChange }) => {
delayedClose();
};

// MAP ITEMS
const mapItems = (users) => {
if (!users) return [];
return users.map(user => {
return {
key: user?.ID,
label: `${ user?.name } (#${ user?.ID })`,
selected: selectedLabel === user?.ID,
};
});
};

return(
<Select
onOpen={() => {
Expand Down Expand Up @@ -76,8 +63,12 @@ const UserSelectField = ({ editing, field, value, onChange }) => {
};

// VIEW MODE
// TODO
const UserSelectFieldView = () => null;
const UserSelectFieldView = () => (
<Select
items={[value]}
renderItem={renderItemView}
/>
);

if (editing) return <UserSelectFieldEdit />;
return <UserSelectFieldView />;
Expand Down
15 changes: 14 additions & 1 deletion components/Post/PostChip.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import Chip from "components/Chip";

import useHaptics from "hooks/use-haptics";
import useStyles from "hooks/use-styles";
import useType from "hooks/use-type";

import { ScreenConstants } from "constants";

Expand All @@ -19,6 +20,7 @@ const PostChip = ({ id, icon, title, type, onRemove, onGoBack }) => {
const navigation = useNavigation();
const { vibrate } = useHaptics();
const { styles, globalStyles } = useStyles(localStyles);
const { postType, getTabScreenFromType } = useType();
const selected = type ? true : null;
return(
<Chip
Expand All @@ -27,12 +29,23 @@ const PostChip = ({ id, icon, title, type, onRemove, onGoBack }) => {
selected={selected}
disabled={!id || !type}
onPress={() => {
if (type !== postType) {
const tabScreen = getTabScreenFromType(type);
navigation.jumpTo(tabScreen, {
screen: ScreenConstants.DETAILS,
id,
name: title,
type,
});
return;
};
navigation.push(ScreenConstants.DETAILS, {
id,
name: title,
type,
onGoBack: () => navigation.goBack()
});
return;
}}
label={titleize(title)}
startIcon={icon ?? null}
Expand All @@ -51,4 +64,4 @@ const PostChip = ({ id, icon, title, type, onRemove, onGoBack }) => {
/>
);
};
export default PostChip;
export default PostChip;
3 changes: 2 additions & 1 deletion constants/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,7 @@ export const FieldNames = Object.freeze({
CHILD_GROUPS: "child_groups",
PEOPLE_GROUPS: "people_groups",
BAPTISM_DATE: "baptism_date",
LEADERS: "leaders",
MEMBER_COUNT: "member_count",
MEMBERS: "members",
GROUPS: "groups",
Expand Down Expand Up @@ -232,7 +233,7 @@ export const TypeConstants = Object.freeze({
GROUP: "groups",
NOTIFICATION: "notifications",
TRAINING: "trainings",
PEOPLEGROUPS: "peoplegroups",
PEOPLE_GROUP: "peoplegroups",
MY_USER: "contacts",
});

Expand Down
Loading

0 comments on commit 76ffd12

Please sign in to comment.