Skip to content

Fix - Update the Billing toggle in Tags to display the billable setting on Collect workspaces #58768

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

Merged
grgia merged 7 commits into from
Mar 27, 2025
Merged

Fix - Update the Billing toggle in Tags to display the billable setting on Collect workspaces #58768

Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
6d604aa
remove areRulesEnabled check
FitseTLT Mar 19, 2025
f889f3a
lint fix
FitseTLT Mar 19, 2025
90e9bbb
Merge branch 'main' into fix-hiding-billable-option-when-rules-are-di…
FitseTLT Mar 20, 2025
5780fa2
lint fix
FitseTLT Mar 20, 2025
21c19f1
Merge branch 'main' into fix-hiding-billable-option-when-rules-are-di…
FitseTLT Mar 20, 2025
136d113
Merge branch 'main' into fix-hiding-billable-option-when-rules-are-di…
FitseTLT Mar 21, 2025
d264e2d
disable when tags are disabled
FitseTLT Mar 21, 2025
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
55 changes: 27 additions & 28 deletions src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,19 +12,19 @@ import Text from '@components/Text';
import useLocalize from '@hooks/useLocalize';
import useNetwork from '@hooks/useNetwork';
import useThemeStyles from '@hooks/useThemeStyles';
import * as Tag from '@libs/actions/Policy/Tag';
import {disableWorkspaceBillableExpenses, setPolicyBillableMode} from '@libs/actions/Policy/Policy';
import {clearPolicyTagListErrors, setPolicyRequiresTag} from '@libs/actions/Policy/Tag';
import Navigation from '@libs/Navigation/Navigation';
import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
import * as OptionsListUtils from '@libs/OptionsListUtils';
import * as PolicyUtils from '@libs/PolicyUtils';
import {hasEnabledOptions as hasEnabledOptionsUtil} from '@libs/OptionsListUtils';
import {getTagLists as getTagListsUtil, isMultiLevelTags as isMultiLevelTagsUtil} from '@libs/PolicyUtils';
import type {SettingsNavigatorParamList} from '@navigation/types';
import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper';
import * as Policy from '@userActions/Policy/Policy';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
import ROUTES from '@src/ROUTES';
import type SCREENS from '@src/SCREENS';
import type * as OnyxTypes from '@src/types/onyx';
import type {Policy} from '@src/types/onyx';

type WorkspaceTagsSettingsPageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.TAGS_SETTINGS>;

Expand All @@ -33,45 +33,45 @@ type WorkspaceTagsSettingsPageProps = PlatformStackScreenProps<SettingsNavigator
* setPolicyBillableMode changes disabledFields and defaultBillable and is called when disabledFields.defaultBillable is set.
* Otherwise, disableWorkspaceBillableExpenses is used and it changes only disabledFields
* */
function billableExpensesPending(policy: OnyxEntry<OnyxTypes.Policy>) {
function billableExpensesPending(policy: OnyxEntry<Policy>) {
if (policy?.disabledFields?.defaultBillable) {
return policy?.pendingFields?.disabledFields ?? policy?.pendingFields?.defaultBillable;
}
return policy?.pendingFields?.disabledFields;
}

function toggleBillableExpenses(policy: OnyxEntry<OnyxTypes.Policy>) {
function toggleBillableExpenses(policy: OnyxEntry<Policy>) {
if (policy?.disabledFields?.defaultBillable) {
Policy.setPolicyBillableMode(policy.id, false);
setPolicyBillableMode(policy.id, false);
} else if (policy) {
Policy.disableWorkspaceBillableExpenses(policy.id);
disableWorkspaceBillableExpenses(policy.id);
}
}

function WorkspaceTagsSettingsPage({route}: WorkspaceTagsSettingsPageProps) {
const policyID = route.params.policyID ?? '-1';
const policyID = route.params.policyID;
const backTo = route.params.backTo;
const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`);
const styles = useThemeStyles();
const {translate} = useLocalize();
const [policyTagLists, isMultiLevelTags] = useMemo(() => [PolicyUtils.getTagLists(policyTags), PolicyUtils.isMultiLevelTags(policyTags)], [policyTags]);
const isLoading = !PolicyUtils.getTagLists(policyTags)?.at(0) || Object.keys(policyTags ?? {}).at(0) === 'undefined';
const [policyTagLists, isMultiLevelTags] = useMemo(() => [getTagListsUtil(policyTags), isMultiLevelTagsUtil(policyTags)], [policyTags]);
const isLoading = !getTagListsUtil(policyTags)?.at(0) || Object.keys(policyTags ?? {}).at(0) === 'undefined';
const {isOffline} = useNetwork();
const hasEnabledOptions = OptionsListUtils.hasEnabledOptions(Object.values(policyTags ?? {}).flatMap(({tags}) => Object.values(tags)));
const hasEnabledOptions = hasEnabledOptionsUtil(Object.values(policyTags ?? {}).flatMap(({tags}) => Object.values(tags)));
const updateWorkspaceRequiresTag = useCallback(
(value: boolean) => {
Tag.setPolicyRequiresTag(policyID, value);
setPolicyRequiresTag(policyID, value);
},
[policyID],
);
const isQuickSettingsFlow = !!backTo;

const getTagsSettings = (policy: OnyxEntry<OnyxTypes.Policy>) => (
const getTagsSettings = (policy: OnyxEntry<Policy>) => (
<View style={styles.flexGrow1}>
{!isMultiLevelTags && (
<OfflineWithFeedback
errors={policyTags?.[policyTagLists.at(0)?.name ?? '']?.errors}
onClose={() => Tag.clearPolicyTagListErrors(policyID, policyTagLists.at(0)?.orderWeight ?? 0)}
onClose={() => clearPolicyTagListErrors(policyID, policyTagLists.at(0)?.orderWeight ?? 0)}
pendingAction={policyTags?.[policyTagLists.at(0)?.name ?? '']?.pendingAction}
errorRowStyles={styles.mh5}
>
Expand Down Expand Up @@ -104,18 +104,17 @@ function WorkspaceTagsSettingsPage({route}: WorkspaceTagsSettingsPageProps) {
/>
</View>
</OfflineWithFeedback>
{!!policy?.areRulesEnabled && (
<OfflineWithFeedback pendingAction={billableExpensesPending(policy)}>
<View style={[styles.flexRow, styles.mh5, styles.mv4, styles.alignItemsCenter, styles.justifyContentBetween]}>
<Text style={[styles.textNormal]}>{translate('workspace.tags.trackBillable')}</Text>
<Switch
isOn={!(policy?.disabledFields?.defaultBillable ?? false)}
accessibilityLabel={translate('workspace.tags.trackBillable')}
onToggle={() => toggleBillableExpenses(policy)}
/>
</View>
</OfflineWithFeedback>
)}
<OfflineWithFeedback pendingAction={billableExpensesPending(policy)}>
<View style={[styles.flexRow, styles.mh5, styles.mv4, styles.alignItemsCenter, styles.justifyContentBetween]}>
<Text style={[styles.textNormal]}>{translate('workspace.tags.trackBillable')}</Text>
<Switch
isOn={!(policy?.disabledFields?.defaultBillable ?? false)}
accessibilityLabel={translate('workspace.tags.trackBillable')}
onToggle={() => toggleBillableExpenses(policy)}
disabled={!policy?.areTagsEnabled}
/>
</View>
</OfflineWithFeedback>
</View>
);
return (
Expand Down