Skip to content

Commit c020034

Browse files
jaaydenhjaaydenh
committed
feat: changes for premium page
1 parent a86a457 commit c020034

File tree

13 files changed

+281
-29
lines changed

13 files changed

+281
-29
lines changed

‎site/components.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "new-york",
4+
"rsc": false,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "tailwind.config.js",
8+
"css": "src/index.css",
9+
"baseColor": "zinc",
10+
"cssVariables": false,
11+
"prefix": ""
12+
},
13+
"aliases": {
14+
"components": "@/components",
15+
"utils": "@/lib/utils",
16+
"ui": "@/components/ui",
17+
"lib": "@/lib",
18+
"hooks": "@/hooks"
19+
}
20+
}

‎site/package.json

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,8 @@
5050
"@mui/system": "5.16.7",
5151
"@mui/utils": "5.16.6",
5252
"@mui/x-tree-view": "7.18.0",
53+
"@radix-ui/react-icons": "1.3.0",
54+
"@radix-ui/react-slot": "1.1.0",
5355
"@tanstack/react-query-devtools": "4.35.3",
5456
"@xterm/addon-canvas": "0.7.0",
5557
"@xterm/addon-fit": "0.10.0",
@@ -64,6 +66,8 @@
6466
"chartjs-adapter-date-fns": "3.0.0",
6567
"chartjs-plugin-annotation": "3.0.1",
6668
"chroma-js": "2.4.2",
69+
"class-variance-authority": "0.7.0",
70+
"clsx": "2.1.1",
6771
"color-convert": "2.0.1",
6872
"cron-parser": "4.9.0",
6973
"cronstrue": "2.50.0",
@@ -75,6 +79,7 @@
7579
"front-matter": "4.0.2",
7680
"jszip": "3.10.1",
7781
"lodash": "4.17.21",
82+
"lucide-react": "0.454.0",
7883
"monaco-editor": "0.52.0",
7984
"pretty-bytes": "6.1.1",
8085
"react": "18.3.1",
@@ -94,6 +99,8 @@
9499
"resize-observer-polyfill": "1.5.1",
95100
"rollup-plugin-visualizer": "5.12.0",
96101
"semver": "7.6.2",
102+
"tailwind-merge": "2.5.4",
103+
"tailwindcss-animate": "1.0.7",
97104
"tzdata": "1.0.40",
98105
"ua-parser-js": "1.0.33",
99106
"ufuzzy": "npm:@leeoniya/ufuzzy@1.0.10",
@@ -170,11 +177,7 @@
170177
"vite-plugin-checker": "0.8.0",
171178
"vite-plugin-turbosnap": "1.0.3"
172179
},
173-
"browserslist": [
174-
"chrome 110",
175-
"firefox 111",
176-
"safari 16.0"
177-
],
180+
"browserslist": ["chrome 110", "firefox 111", "safari 16.0"],
178181
"resolutions": {
179182
"optionator": "0.9.3",
180183
"semver": "7.6.2"

‎site/pnpm-lock.yaml

Lines changed: 66 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎site/src/components/ui/button.tsx

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import * as React from "react"
2+
import { Slot } from "@radix-ui/react-slot"
3+
import { cva, type VariantProps } from "class-variance-authority"
4+
5+
import { cn } from "@/lib/utils"
6+
7+
const buttonVariants = cva(
8+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
9+
{
10+
variants: {
11+
variant: {
12+
default:
13+
"bg-primary text-primary-foreground shadow hover:bg-primary/90",
14+
destructive:
15+
"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
16+
outline:
17+
"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
18+
secondary:
19+
"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
20+
ghost: "hover:bg-accent hover:text-accent-foreground",
21+
link: "text-primary underline-offset-4 hover:underline",
22+
},
23+
size: {
24+
default: "h-9 px-4 py-2",
25+
sm: "h-8 rounded-md px-3 text-xs",
26+
lg: "h-10 rounded-md px-8",
27+
icon: "h-9 w-9",
28+
},
29+
},
30+
defaultVariants: {
31+
variant: "default",
32+
size: "default",
33+
},
34+
}
35+
)
36+
37+
export interface ButtonProps
38+
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
39+
VariantProps<typeof buttonVariants> {
40+
asChild?: boolean
41+
}
42+
43+
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
44+
({ className, variant, size, asChild = false, ...props }, ref) => {
45+
const Comp = asChild ? Slot : "button"
46+
return (
47+
<Comp
48+
className={cn(buttonVariants({ variant, size, className }))}
49+
ref={ref}
50+
{...props}
51+
/>
52+
)
53+
}
54+
)
55+
Button.displayName = "Button"
56+
57+
export { Button, buttonVariants }

‎site/src/index.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
11
@tailwind base;
22
@tailwind components;
33
@tailwind utilities;
4+
@layer base {
5+
:root {
6+
--radius: 0.5rem
7+
}
8+
}

‎site/src/lib/utils.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { clsx, type ClassValue } from "clsx"
2+
import { twMerge } from "tailwind-merge"
3+
4+
export function cn(...inputs: ClassValue[]) {
5+
return twMerge(clsx(inputs))
6+
}

‎site/src/modules/management/SidebarView.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,7 @@ const DeploymentSettingsNavigation: FC<DeploymentSettingsNavigationProps> = ({
150150
</Stack>
151151
</SidebarNavSubItem>
152152
)}
153+
<SidebarNavSubItem href="premium">Premium</SidebarNavSubItem>
153154
</Stack>
154155
)}
155156
</div>

‎site/src/pages/DeploymentSettingsPage/PremiumPage/PremiumPage.tsx

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { Loader } from "components/Loader/Loader";
2+
import { useDeploymentSettings } from "modules/management/DeploymentSettingsProvider";
3+
import type { FC } from "react";
4+
import { Helmet } from "react-helmet-async";
5+
import { pageTitle } from "utils/page";
6+
import { PremiumPageView } from "./PremiumPageView";
7+
import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility";
8+
9+
const PremiumPage: FC = () => {
10+
const { multiple_organizations: hasPremiumLicense } = useFeatureVisibility();
11+
12+
return (
13+
<>
14+
<Helmet>
15+
<title>{pageTitle("Premium Features")}</title>
16+
</Helmet>
17+
<PremiumPageView isPremium={hasPremiumLicense} />
18+
</>
19+
);
20+
};
21+
22+
export default PremiumPage;

‎site/src/pages/DeploymentSettingsPage/PremiumPage/PremiumPageView.tsx

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import type { SerpentOption } from "api/typesGenerated";
2+
import {
3+
Badges,
4+
DisabledBadge,
5+
EnabledBadge,
6+
PremiumBadge,
7+
} from "components/Badges/Badges";
8+
// import { SettingsHeader } from "components/SettingsHeader/SettingsHeader";
9+
// import { Stack } from "components/Stack/Stack";
10+
import { Button } from "@/components/ui/button";
11+
import type { FC } from "react";
12+
13+
export type PremiumPageViewProps = { isPremium: boolean };
14+
15+
export const PremiumPageView: FC<PremiumPageViewProps> = ({ isPremium }) => {
16+
return (
17+
<div className="pr-32">
18+
<div className="flex flex-row justify-between align-baseline">
19+
<div>
20+
<h1>Premium</h1>
21+
<p className="max-w-lg">
22+
Overview of all features that are not covered by the OSS license.
23+
</p>
24+
</div>
25+
<Button variant="default">Upgrade to Premium</Button>
26+
</div>
27+
28+
<h2>Organizations</h2>
29+
<p className="max-w-lg">
30+
Create multiple organizations within a single Coder deployment, allowing
31+
several platform teams to operate with isolated users, templates, and
32+
distinct underlying infrastructure.
33+
</p>
34+
35+
<h2>Appearance</h2>
36+
<p>Customize the look and feel of your Coder deployment.</p>
37+
38+
<h2>Observability</h2>
39+
<p>Allow auditors to monitor user operations in your deployment.</p>
40+
41+
<h2>Provisioners</h2>
42+
<p>Provisioners run your Terraform to create templates and workspaces.</p>
43+
44+
<h2>Custom Roles</h2>
45+
<p>
46+
Create custom roles to grant users a tailored set of granular
47+
permissions.
48+
</p>
49+
50+
<h2>IdP Sync</h2>
51+
<p>
52+
Configure group and role mappings to manage permissions outside of
53+
Coder.{" "}
54+
</p>
55+
</div>
56+
);
57+
};

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy