Skip to content

Commit

Permalink
frontend: Adding Project Catalog conditionally to Project Selector Li…
Browse files Browse the repository at this point in the history
…nks (#2818)
  • Loading branch information
jdslaugh authored Oct 19, 2023
1 parent b03436c commit b979bb4
Show file tree
Hide file tree
Showing 4 changed files with 56 additions and 4 deletions.
5 changes: 5 additions & 0 deletions frontend/packages/app/public/icons/Catalog.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
26 changes: 25 additions & 1 deletion frontend/packages/core/src/flags.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -72,10 +72,27 @@ interface SimpleFeatureFlagStateProps {
children: React.ReactNode;
}

interface SimpleFeatureEnabledProps {
/** The name of the feature flag to lookup */
feature: string;
}

const FeatureOn = ({ children }: SimpleFeatureFlagStateProps) => <>{children}</>;

const FeatureOff = ({ children }: SimpleFeatureFlagStateProps) => <>{children}</>;

const checkFeatureEnabled = ({ feature }: SimpleFeatureEnabledProps) => {
const cachedFlags = JSON.parse(sessionStorage.getItem("featureFlags"));
let featureEnabled = false;

const flag = cachedFlags?.flags?.[feature];
if (flag !== undefined) {
featureEnabled = flag.booleanValue;
}

return featureEnabled;
};

/**
* A feature flag wrapper that evaluates a binary value of a specified flag to determine
* if it's children should be shown.
Expand Down Expand Up @@ -114,4 +131,11 @@ const SimpleFeatureFlag = ({ feature, children }: SimpleFeatureFlagProps) => {
return <>{statefulChildren}</>;
};

export { FEATURE_FLAG_POLL_RATE, featureFlags, FeatureOff, FeatureOn, SimpleFeatureFlag };
export {
FEATURE_FLAG_POLL_RATE,
featureFlags,
checkFeatureEnabled,
FeatureOff,
FeatureOn,
SimpleFeatureFlag,
};
2 changes: 1 addition & 1 deletion frontend/packages/core/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ export {
} from "./Contexts";
export { Dialog, DialogActions, DialogContent } from "./dialog";
export * from "./Feedback";
export { FeatureOff, FeatureOn, SimpleFeatureFlag } from "./flags";
export { checkFeatureEnabled, FeatureOff, FeatureOn, SimpleFeatureFlag } from "./flags";
export { default as Grid } from "./grid";
export { AvatarIcon, StatusIcon } from "./icon";
export * from "./Input";
Expand Down
27 changes: 25 additions & 2 deletions frontend/workflows/projectSelector/src/project-group.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import * as React from "react";
import { Checkbox, Switch } from "@clutch-sh/core";
import { Checkbox, checkFeatureEnabled, Switch } from "@clutch-sh/core";
import styled from "@emotion/styled";
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
import ClearIcon from "@mui/icons-material/Clear";
Expand Down Expand Up @@ -139,6 +139,26 @@ const ProjectGroup: React.FC<ProjectGroupProps> = ({ title, group, displayToggle
const numProjects = groupKeys.length;
const checkedProjects = groupKeys.filter(k => state?.[group][k].checked);

const additionalQuickLinks = (key: string) => {
const links: any[] = [];

if (checkFeatureEnabled({ feature: "projectCatalog" })) {
links.push({
name: "Project Catalog",
links: [
{
name: "Project Catalog",
trackingId: "dash-project-catalog",
url: `/catalog/${key}`,
},
],
imagePath: "/icons/Catalog.svg",
});
}

return links;
};

// We need to keep track of which project has its quick links open so that we know
// to hide the other projects' buttons
const [quickLinksWindowKey, setQuickLinksWindowKey] = React.useState<string>("");
Expand Down Expand Up @@ -235,7 +255,10 @@ const ProjectGroup: React.FC<ProjectGroupProps> = ({ title, group, displayToggle
</StyledHoverOptions>
{!state?.loading && state?.projectData?.[key]?.linkGroups && (
<ProjectLinks
linkGroups={state?.projectData?.[key]?.linkGroups ?? []}
linkGroups={[
...(state?.projectData?.[key]?.linkGroups ?? []),
...additionalQuickLinks(key),
]}
onOpen={() => onOpenQuickLinks(key)}
onClose={onCloseQuickLinks}
showOpenButton={quickLinksWindowKey !== key}
Expand Down

0 comments on commit b979bb4

Please sign in to comment.