✨ Add usage-based new pricing plans

apps/builder/components/shared/ChangePlanForm/components/FeaturesList.tsx

@@ -0,0 +1,21 @@
+import {
+  ListProps,
+  UnorderedList,
+  Flex,
+  ListItem,
+  ListIcon,
+} from '@chakra-ui/react'
+import { CheckIcon } from 'assets/icons'
+
+type FeaturesListProps = { features: (string | JSX.Element)[] } & ListProps
+
+export const FeaturesList = ({ features, ...props }: FeaturesListProps) => (
+  <UnorderedList listStyleType="none" spacing={2} {...props}>
+    {features.map((feat, idx) => (
+      <Flex as={ListItem} key={idx} alignItems="center">
+        <ListIcon as={CheckIcon} />
+        {feat}
+      </Flex>
+    ))}
+  </UnorderedList>
+)