Skip to content

Commit

Permalink
feat(organizations): remove mmos feature flag TASK-1397 (#5392)
Browse files Browse the repository at this point in the history
### 📣 Summary
Now the Organizations feature implemented up to this point is no longer
hidden behind a feature flag


### 📖 Description
- `isMMosEnabled` feature flag was removed
- routes and menus hidden behind it are now enabled by default
- organizationQuery no longer returns fixed result for `is_mmo`

### 👀 Preview steps
Feature/no-change template:
1. ℹ️ have account
2. ℹ️ have or be part of an organization
3. ℹ️ Make sure to disable the active feature flag with
`?ff_isMMosEnabled=false` or cleaning your session storage
4. Navigate to account settings
5. 🟢 notice that the organization links are visible
6. 🟢 notice that you can navigate and operate organization feature
freely without the feature flag
  • Loading branch information
pauloamorimbr authored Dec 23, 2024
1 parent 7d0c78f commit 01789ba
Show file tree
Hide file tree
Showing 5 changed files with 45 additions and 76 deletions.
4 changes: 1 addition & 3 deletions jsapp/js/account/accountSidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import {
useOrganizationQuery,
OrganizationUserRole,
} from 'js/account/organization/organizationQuery';
import {useFeatureFlag, FeatureFlag} from 'js/featureFlags';
import {getSimpleMMOLabel} from './organization/organization.utils';
import LoadingSpinner from 'js/components/common/loadingSpinner';

Expand Down Expand Up @@ -168,7 +167,6 @@ function renderMmoSidebar(

function AccountSidebar() {
const [isStripeEnabled, setIsStripeEnabled] = useState(false);
const enableMMORoutes = useFeatureFlag(FeatureFlag.mmosEnabled);
const orgQuery = useOrganizationQuery();

useWhenStripeIsEnabled(() => {
Expand All @@ -191,7 +189,7 @@ function AccountSidebar() {
return <LoadingSpinner />;
}

if (orgQuery.data.is_mmo && enableMMORoutes) {
if (orgQuery.data.is_mmo) {
return renderMmoSidebar(
orgQuery.data?.request_user_role,
isStripeEnabled,
Expand Down
44 changes: 13 additions & 31 deletions jsapp/js/account/organization/organizationQuery.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {useEffect} from 'react';

// Stores, hooks and utilities
import {fetchGetUrl, fetchPatch} from 'jsapp/js/api';
import {FeatureFlag, useFeatureFlag} from 'js/featureFlags';
import {useSession} from 'jsapp/js/stores/useSession';

// Constants and types
Expand All @@ -13,10 +12,15 @@ import {QueryKeys} from 'js/query/queryKeys';
import {queryClient} from 'jsapp/js/query/queryClient';

// Comes from `kobo/apps/accounts/forms.py`
export type OrganizationTypeName = 'non-profit' | 'government' | 'educational' | 'commercial' | 'none';
export type OrganizationTypeName =
| 'non-profit'
| 'government'
| 'educational'
| 'commercial'
| 'none';

export const ORGANIZATION_TYPES: {
[P in OrganizationTypeName]: {name: OrganizationTypeName; label: string}
[P in OrganizationTypeName]: {name: OrganizationTypeName; label: string};
} = {
'non-profit': {name: 'non-profit', label: t('Non-profit organization')},
government: {name: 'government', label: t('Government institution')},
Expand Down Expand Up @@ -79,8 +83,6 @@ interface OrganizationQueryParams {
* to invalidate data and refetch when absolute latest data is needed.
*/
export const useOrganizationQuery = (params?: OrganizationQueryParams) => {
const isMmosEnabled = useFeatureFlag(FeatureFlag.mmosEnabled);

useEffect(() => {
if (params?.shouldForceInvalidation) {
queryClient.invalidateQueries({
Expand All @@ -93,37 +95,17 @@ export const useOrganizationQuery = (params?: OrganizationQueryParams) => {
const session = useSession();
const organizationUrl = session.currentLoggedAccount?.organization?.url;

// Using a separated function to fetch the organization data to prevent
// feature flag dependencies from being added to the hook
const fetchOrganization = async (): Promise<Organization> => {
// `organizationUrl` is a full url with protocol and domain name, so we're
// using fetchGetUrl.
// We're asserting the `organizationUrl` is not `undefined` here because
// the query is disabled without it.
const organization = await fetchGetUrl<Organization>(organizationUrl!);

if (isMmosEnabled) {
return organization;
}

// While the project is in development we will force a `false` return for
// the `is_mmo` to make sure we don't have any implementations appearing
// for users.
return {
...organization,
is_mmo: false,
};
};

// Setting the 'enabled' property so the query won't run until we have
// the session data loaded. Account data is needed to fetch the organization
// data.

const query = useQuery<Organization, FailResponse, Organization, QueryKeys[]>({
const query = useQuery<Organization, FailResponse>({
staleTime: 1000 * 60 * 2,
queryFn: fetchOrganization,
queryKey: [QueryKeys.organization],
enabled: !!organizationUrl
// We're asserting the `organizationUrl` is not `undefined` here because
// the query is disabled without it.
queryFn: () => fetchGetUrl<Organization>(organizationUrl!),
queryKey: [QueryKeys.organization, organizationUrl],
enabled: !!organizationUrl,
});

// `organizationUrl` must exist, unless it's changed (e.g. user added/removed
Expand Down
66 changes: 30 additions & 36 deletions jsapp/js/account/routes.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,8 @@ import {
MembersRoute,
OrganizationSettingsRoute,
} from 'js/account/routes.constants';
import {useFeatureFlag, FeatureFlag} from 'js/featureFlags';

export default function routes() {
const enableMMORoutes = useFeatureFlag(FeatureFlag.mmosEnabled);

return (
<>
Expand Down Expand Up @@ -112,40 +110,36 @@ export default function routes() {
</RequireAuth>
}
/>
{enableMMORoutes && (
<>
<Route
path={ACCOUNT_ROUTES.ORGANIZATION_MEMBERS}
element={
<RequireAuth>
<RequireOrgPermissions
mmoOnly
redirectRoute={ACCOUNT_ROUTES.ACCOUNT_SETTINGS}
>
<MembersRoute />
</RequireOrgPermissions>
</RequireAuth>
}
/>
<Route
path={ACCOUNT_ROUTES.ORGANIZATION_SETTINGS}
element={
<RequireAuth>
<RequireOrgPermissions
validRoles={[
OrganizationUserRole.owner,
OrganizationUserRole.admin,
]}
mmoOnly
redirectRoute={ACCOUNT_ROUTES.ACCOUNT_SETTINGS}
>
<OrganizationSettingsRoute />
</RequireOrgPermissions>
</RequireAuth>
}
/>
</>
)}
<Route
path={ACCOUNT_ROUTES.ORGANIZATION_MEMBERS}
element={
<RequireAuth>
<RequireOrgPermissions
mmoOnly
redirectRoute={ACCOUNT_ROUTES.ACCOUNT_SETTINGS}
>
<MembersRoute />
</RequireOrgPermissions>
</RequireAuth>
}
/>
<Route
path={ACCOUNT_ROUTES.ORGANIZATION_SETTINGS}
element={
<RequireAuth>
<RequireOrgPermissions
validRoles={[
OrganizationUserRole.owner,
OrganizationUserRole.admin,
]}
mmoOnly
redirectRoute={ACCOUNT_ROUTES.ACCOUNT_SETTINGS}
>
<OrganizationSettingsRoute />
</RequireOrgPermissions>
</RequireAuth>
}
/>
</>
);
}
6 changes: 1 addition & 5 deletions jsapp/js/account/usage/yourPlan.component.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ import {ProductsContext} from '../useProducts.hook';
import {getSubscriptionChangeDetails} from '../stripe.utils';
import {ACCOUNT_ROUTES} from 'js/account/routes.constants';
import {useOrganizationQuery} from '../organization/organizationQuery';
import {FeatureFlag, useFeatureFlag} from 'jsapp/js/featureFlags';

const BADGE_COLOR_KEYS: {[key in SubscriptionChangeType]: BadgeColor} = {
[SubscriptionChangeType.RENEWAL]: 'light-blue',
Expand All @@ -35,7 +34,6 @@ export const YourPlan = () => {
const [session] = useState(() => sessionStore);
const [productsContext] = useContext(ProductsContext);
const orgQuery = useOrganizationQuery();
const areMmosEnabled = useFeatureFlag(FeatureFlag.mmosEnabled);

const planName = subscriptions.planName;

Expand All @@ -62,9 +60,7 @@ export const YourPlan = () => {
}
}, [env.isReady, subscriptions.isInitialised]);

const showPlanUpdateLink = areMmosEnabled
? orgQuery.data?.request_user_role === 'owner'
: true;
const showPlanUpdateLink = orgQuery.data?.request_user_role === 'owner';

const subscriptionUpdate = useMemo(() => {
return getSubscriptionChangeDetails(currentPlan, productsContext.products);
Expand Down
1 change: 0 additions & 1 deletion jsapp/js/featureFlags.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
* For our sanity, use camel case and match key with value.
*/
export enum FeatureFlag {
mmosEnabled = 'mmosEnabled',
oneTimeAddonsEnabled = 'oneTimeAddonsEnabled',
exportActivityLogsEnabled = 'exportActivityLogsEnabled',
}
Expand Down

0 comments on commit 01789ba

Please sign in to comment.