Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add missing multi tag view #41351

Merged
merged 27 commits into from
May 12, 2024
+536 −218
Merged

Add missing multi tag view #41351

Show file tree
Hide file tree
Changes from 16 commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
2a4ba06
copy changes from 41337
s77rt Apr 30, 2024
7477b7c
copy changes from 41337
s77rt Apr 30, 2024
04b4088
add remaining changes
s77rt Apr 30, 2024
df022b8
remove required switch
s77rt Apr 30, 2024
5b4a282
Use ListItemRightCaretWithLabel
s77rt May 1, 2024
c09c9c0
address some review comments
s77rt May 1, 2024
5b5b3ad
Remove checkbox for multi-level tag
s77rt May 1, 2024
700306d
Remove right arrow for multi-level tag
s77rt May 1, 2024
afed798
Fix alignment
s77rt May 1, 2024
cc3fff3
fix types
s77rt May 2, 2024
4ce218a
Merge branch 'main' into add-multi-tag-view
s77rt May 2, 2024
1b8ca5d
types
s77rt May 2, 2024
e48e289
Simplify getHeaderButtons
s77rt May 2, 2024
7a82dc2
Memorize tagListKeyedByName
s77rt May 2, 2024
0286c85
lint
s77rt May 2, 2024
c4bbded
Merge branch 'main' into add-multi-tag-view
s77rt May 2, 2024
534fdf4
Merge branch 'main' into add-multi-tag-view
s77rt May 4, 2024
1ed2c43
Prevent tag deletion if we have an accounting connection
s77rt May 4, 2024
0803519
Prevent tag addition if we have an accounting connection
s77rt May 4, 2024
3115665
Add missing policy (useOnyx)
s77rt May 4, 2024
eb2ba6f
lint
s77rt May 4, 2024
eafa904
Merge branch 'main' into add-multi-tag-view
s77rt May 7, 2024
8e8a063
Simplify tags logic
s77rt May 7, 2024
dfbd051
remove unnecessary variable
s77rt May 7, 2024
b70ce49
better types
s77rt May 9, 2024
d72c619
Merge branch 'main' into add-multi-tag-view
s77rt May 12, 2024
8935e0a
use correct state variable names
s77rt May 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 6 additions & 2 deletions src/ROUTES.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -665,8 +665,8 @@ const ROUTES = {
getRoute: (policyID: string) => `settings/workspaces/${policyID}/tags/settings` as const,
},
WORKSPACE_EDIT_TAGS: {
route: 'settings/workspaces/:policyID/tags/edit',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/tags/edit` as const,
route: 'settings/workspaces/:policyID/tags/:orderWeight/edit',
getRoute: (policyID: string, orderWeight: number) => `settings/workspaces/${policyID}/tags/${orderWeight}/edit` as const,
},
WORKSPACE_TAG_EDIT: {
route: 'settings/workspace/:policyID/tag/:tagName/edit',
Expand All @@ -676,6 +676,10 @@ const ROUTES = {
route: 'settings/workspaces/:policyID/tag/:tagName',
getRoute: (policyID: string, tagName: string) => `settings/workspaces/${policyID}/tag/${encodeURIComponent(tagName)}` as const,
},
WORKSPACE_TAG_LIST_VIEW: {
route: 'settings/workspaces/:policyID/tag-list/:orderWeight',
getRoute: (policyID: string, orderWeight: number) => `settings/workspaces/${policyID}/tag-list/${orderWeight}` as const,
},
WORKSPACE_TAXES: {
route: 'settings/workspaces/:policyID/taxes',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/taxes` as const,
Expand Down
1 change: 1 addition & 0 deletions src/SCREENS.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,7 @@ const SCREENS = {
TAX_CREATE: 'Workspace_Tax_Create',
TAG_CREATE: 'Tag_Create',
TAG_SETTINGS: 'Tag_Settings',
TAG_LIST_VIEW: 'Tag_List_View',
CURRENCY: 'Workspace_Profile_Currency',
ADDRESS: 'Workspace_Profile_Address',
WORKFLOWS: 'Workspace_Workflows',
Expand Down
35 changes: 35 additions & 0 deletions src/components/SelectionList/ListItemRightCaretWithLabel.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import React from 'react';
import {View} from 'react-native';
import Icon from '@components/Icon';
import * as Expensicons from '@components/Icon/Expensicons';
import Text from '@components/Text';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';

type ListItemRightCaretWithLabelProps = {
labelText?: string;
shouldShowCaret?: boolean;
};

function ListItemRightCaretWithLabel({labelText, shouldShowCaret = true}: ListItemRightCaretWithLabelProps) {
const styles = useThemeStyles();
const theme = useTheme();

return (
<View style={styles.flexRow}>
{!!labelText && <Text style={[styles.alignSelfCenter, styles.textSupporting, styles.pl2, styles.label]}>{labelText}</Text>}
{shouldShowCaret && (
<View style={[styles.pl2]}>
<Icon
src={Expensicons.ArrowRight}
fill={theme.icon}
/>
</View>
)}
</View>
);
}

ListItemRightCaretWithLabel.displayName = 'ListItemRightCaretWithLabel';

export default ListItemRightCaretWithLabel;
36 changes: 0 additions & 36 deletions src/components/SelectionList/RightElementEnabledStatus.tsx
View file
Open in desktop

This file was deleted.

1 change: 1 addition & 0 deletions src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -243,6 +243,7 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
[SCREENS.WORKSPACE.DISTANCE_RATE_EDIT]: () => require('../../../../pages/workspace/distanceRates/PolicyDistanceRateEditPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAGS_SETTINGS]: () => require('../../../../pages/workspace/tags/WorkspaceTagsSettingsPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAG_SETTINGS]: () => require('../../../../pages/workspace/tags/TagSettingsPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAG_LIST_VIEW]: () => require('../../../../pages/workspace/tags/WorkspaceViewTagsPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAGS_EDIT]: () => require('../../../../pages/workspace/tags/WorkspaceEditTagsPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAG_CREATE]: () => require('../../../../pages/workspace/tags/WorkspaceCreateTagPage').default as React.ComponentType,
[SCREENS.WORKSPACE.TAG_EDIT]: () => require('../../../../pages/workspace/tags/EditTagPage').default as React.ComponentType,
Expand Down
9 changes: 8 additions & 1 deletion src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,14 @@ const FULL_SCREEN_TO_RHP_MAPPING: Partial<Record<FullScreenName, string[]>> = {
SCREENS.WORKSPACE.TAX_NAME,
SCREENS.WORKSPACE.TAX_VALUE,
],
[SCREENS.WORKSPACE.TAGS]: [SCREENS.WORKSPACE.TAGS_SETTINGS, SCREENS.WORKSPACE.TAGS_EDIT, SCREENS.WORKSPACE.TAG_CREATE, SCREENS.WORKSPACE.TAG_SETTINGS, SCREENS.WORKSPACE.TAG_EDIT],
[SCREENS.WORKSPACE.TAGS]: [
SCREENS.WORKSPACE.TAGS_SETTINGS,
SCREENS.WORKSPACE.TAGS_EDIT,
SCREENS.WORKSPACE.TAG_CREATE,
SCREENS.WORKSPACE.TAG_SETTINGS,
SCREENS.WORKSPACE.TAG_EDIT,
SCREENS.WORKSPACE.TAG_LIST_VIEW,
],
[SCREENS.WORKSPACE.CATEGORIES]: [SCREENS.WORKSPACE.CATEGORY_CREATE, SCREENS.WORKSPACE.CATEGORY_SETTINGS, SCREENS.WORKSPACE.CATEGORIES_SETTINGS, SCREENS.WORKSPACE.CATEGORY_EDIT],
[SCREENS.WORKSPACE.DISTANCE_RATES]: [
SCREENS.WORKSPACE.CREATE_DISTANCE_RATE,
Expand Down
9 changes: 9 additions & 0 deletions src/libs/Navigation/linkingConfig/config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -411,6 +411,9 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
},
[SCREENS.WORKSPACE.TAGS_EDIT]: {
path: ROUTES.WORKSPACE_EDIT_TAGS.route,
parse: {
orderWeight: Number,
},
},
[SCREENS.WORKSPACE.TAG_CREATE]: {
path: ROUTES.WORKSPACE_TAG_CREATE.route,
Expand All @@ -427,6 +430,12 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
tagName: (tagName: string) => decodeURIComponent(tagName),
},
},
[SCREENS.WORKSPACE.TAG_LIST_VIEW]: {
path: ROUTES.WORKSPACE_TAG_LIST_VIEW.route,
parse: {
orderWeight: Number,
},
},
[SCREENS.WORKSPACE.TAXES_SETTINGS]: {
path: ROUTES.WORKSPACE_TAXES_SETTINGS.route,
},
Expand Down
6 changes: 5 additions & 1 deletion src/libs/Navigation/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -214,9 +214,13 @@ type SettingsNavigatorParamList = {
policyID: string;
tagName: string;
};
[SCREENS.WORKSPACE.TAG_LIST_VIEW]: {
policyID: string;
orderWeight: number;
};
[SCREENS.WORKSPACE.TAGS_EDIT]: {
policyID: string;
tagName: string;
orderWeight: number;
};
[SCREENS.WORKSPACE.TAG_EDIT]: {
policyID: string;
Expand Down
2 changes: 1 addition & 1 deletion src/pages/workspace/accounting/qbo/import/QuickbooksImportPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ function QuickbooksImportPage({policy}: WithPolicyProps) {
},
];

if (policy?.connections?.quickbooksOnline.data.country !== CONST.COUNTRY.US) {
if (policy?.connections?.quickbooksOnline?.data?.country !== CONST.COUNTRY.US) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is this change needed? TS does not report that these optional chaining operators are necessary.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah - problem here - that we have crash on this line - seem like TS types for data and country is not expecting to be undefined, but from API side it could :-)
just fyi
Screenshot 2024-05-01 at 11 59 53

Copy link
Contributor

@roryabraham roryabraham May 1, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks for the context! Let's update the TS types for data and country to be optional then? to make sure that we're safely accessing them everywhere, not just here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have updated the type for data to be optional. We need to do the same for the Connection object: both quickbooksOnline and xero are optional. Tried to make that change here but caused ts errors on updatePolicyConnectionConfig. Let's create a separate issue to handle that

sections.push({
description: translate('workspace.accounting.taxes'),
action: () => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_TAXES.getRoute(policyID)),
Expand Down
2 changes: 1 addition & 1 deletion src/pages/workspace/accounting/xero/XeroImportPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ function XeroImportPage({policy}: WithPolicyProps) {
const {importCustomers, importTaxRates, importTrackingCategories, pendingFields} = policy?.connections?.xero?.config ?? {};

const tenants = useMemo(() => getXeroTenants(policy ?? undefined), [policy]);
const currentXeroOrganization = tenants.find((tenant) => tenant.id === policy?.connections?.xero.config.tenantID);
const currentXeroOrganization = tenants.find((tenant) => tenant.id === policy?.connections?.xero?.config.tenantID);

const sections = useMemo(
() => [
Expand Down
2 changes: 1 addition & 1 deletion src/pages/workspace/accounting/xero/XeroOrganizationConfigurationPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ function XeroOrganizationConfigurationPage({
const policyID = policy?.id ?? '';

const sections =
policy?.connections?.xero.data.tenants.map((tenant) => ({
policy?.connections?.xero?.data?.tenants.map((tenant) => ({
text: tenant.name,
keyForList: tenant.id,
isSelected: tenant.id === organizationID,
Expand Down
6 changes: 3 additions & 3 deletions src/pages/workspace/categories/WorkspaceCategoriesPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import * as Expensicons from '@components/Icon/Expensicons';
import * as Illustrations from '@components/Icon/Illustrations';
import ScreenWrapper from '@components/ScreenWrapper';
import SelectionList from '@components/SelectionList';
import RightElementEnabledStatus from '@components/SelectionList/RightElementEnabledStatus';
import ListItemRightCaretWithLabel from '@components/SelectionList/ListItemRightCaretWithLabel';
import TableListItem from '@components/SelectionList/TableListItem';
import type {ListItem} from '@components/SelectionList/types';
import Text from '@components/Text';
Expand Down Expand Up @@ -91,10 +91,10 @@ function WorkspaceCategoriesPage({route}: WorkspaceCategoriesPageProps) {
isDisabled,
pendingAction: value.pendingAction,
errors: value.errors ?? undefined,
rightElement: <RightElementEnabledStatus enabled={value.enabled} />,
rightElement: <ListItemRightCaretWithLabel labelText={value.enabled ? translate('workspace.common.enabled') : translate('workspace.common.disabled')} />,
};
}),
[policyCategories, selectedCategories],
[policyCategories, selectedCategories, translate],
);

const toggleCategory = (category: PolicyOption) => {
Expand Down
4 changes: 2 additions & 2 deletions src/pages/workspace/distanceRates/PolicyDistanceRatesPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import * as Expensicons from '@components/Icon/Expensicons';
import * as Illustrations from '@components/Icon/Illustrations';
import ScreenWrapper from '@components/ScreenWrapper';
import SelectionList from '@components/SelectionList';
import RightElementEnabledStatus from '@components/SelectionList/RightElementEnabledStatus';
import ListItemRightCaretWithLabel from '@components/SelectionList/ListItemRightCaretWithLabel';
import TableListItem from '@components/SelectionList/TableListItem';
import type {ListItem} from '@components/SelectionList/types';
import Text from '@components/Text';
Expand Down Expand Up @@ -111,7 +111,7 @@ function PolicyDistanceRatesPage({policy, route}: PolicyDistanceRatesPageProps)
isDisabled: value.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
pendingAction: value.pendingAction ?? value.pendingFields?.rate ?? value.pendingFields?.enabled ?? value.pendingFields?.currency,
errors: value.errors ?? undefined,
rightElement: <RightElementEnabledStatus enabled={value.enabled} />,
rightElement: <ListItemRightCaretWithLabel labelText={value.enabled ? translate('workspace.common.enabled') : translate('workspace.common.disabled')} />,
})),
[customUnit?.attributes?.unit, customUnitRates, selectedDistanceRates, translate],
);
Expand Down
2 changes: 1 addition & 1 deletion src/pages/workspace/tags/WorkspaceEditTagsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ const validateTagName = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.POLICY_TAG
function WorkspaceEditTagsPage({route, policyTags}: WorkspaceEditTagsPageProps) {
const styles = useThemeStyles();
const {translate} = useLocalize();
const taglistName = useMemo(() => PolicyUtils.getTagLists(policyTags)[0].name, [policyTags]);
const taglistName = useMemo(() => PolicyUtils.getTagListName(policyTags, route.params.orderWeight), [policyTags, route.params.orderWeight]);
const {inputCallbackRef} = useAutoFocusInput();

const updateTaglistName = useCallback(
Expand Down
Loading
Loading