Skip to content

Commit f28e239

Browse files
gregfromstlgregfromstl
authored
Merge branch 'main' into greg/cnct-2441-provide-code-snippet-for-current-api-usage-of-prepare-deploy
2 parents 600c024 + adda60c commit f28e239

File tree

6 files changed

+346
-210
lines changed

6 files changed

+346
-210
lines changed

‎apps/dashboard/src/@/components/TextDivider.tsx‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { cn } from "@/lib/utils";
2+
3+
export function TextDivider(props: {
4+
text: string;
5+
className?: string;
6+
}) {
7+
return (
8+
<div
9+
className={cn(
10+
"flex items-center text-muted-foreground text-sm",
11+
props.className,
12+
)}
13+
>
14+
<span className="h-[1px] flex-1 bg-border" />
15+
<span className="mx-4">{props.text}</span>
16+
<span className="h-[1px] flex-1 bg-border" />
17+
</div>
18+
);
19+
}

‎apps/dashboard/src/@/components/ui/inline-code.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export function InlineCode({
77
return (
88
<code
99
className={cn(
10-
"inline-block rounded bg-muted px-2 font-mono text-sm",
10+
"mx-0.5 inline rounded-lg border border-border px-1.5 py-[3px] font-mono text-[0.85em] text-foreground",
1111
className,
1212
)}
1313
>

‎apps/dashboard/src/app/login/onboarding/ChoosePlan.tsx‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
"use client";
22

3+
import { TextDivider } from "@/components/TextDivider";
34
import { PricingCard } from "@/components/blocks/pricing-card";
45
import { Button } from "@/components/ui/button";
5-
import { ArrowRightIcon } from "lucide-react";
66
import { TitleAndDescription } from "./Title";
77

88
export function OnboardingChoosePlan(props: {
@@ -20,7 +20,7 @@ export function OnboardingChoosePlan(props: {
2020

2121
<div className="h-4" />
2222

23-
<div className="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-4">
23+
<div className="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-5">
2424
<PricingCard
2525
billingPlan="starter"
2626
teamSlug={props.teamSlug}
@@ -51,17 +51,20 @@ export function OnboardingChoosePlan(props: {
5151
/>
5252
</div>
5353

54-
<div className="h-4" />
54+
<TextDivider text="OR" className="my-4" />
5555

56-
<div className="flex justify-center">
57-
<Button
58-
variant="link"
59-
onClick={props.skipPlan}
60-
className="inline-flex translate-x-2 items-center gap-2 text-muted-foreground"
61-
>
62-
Continue with Free Plan <ArrowRightIcon className="size-4" />
63-
</Button>
64-
</div>
56+
<Button
57+
variant="outline"
58+
onClick={props.skipPlan}
59+
className="relative h-auto w-full items-center gap-2 rounded-xl bg-muted/50 py-2.5"
60+
>
61+
<span className="flex flex-col gap-0.5">
62+
<span className="text-base text-foreground">Skip for now</span>
63+
<span className="text-muted-foreground text-sm">
64+
You will have limited access to services
65+
</span>
66+
</span>
67+
</Button>
6568
</div>
6669
);
6770
}

‎apps/dashboard/src/components/contract-components/published-contract/index.tsx‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -131,10 +131,8 @@ export const PublishedContract: React.FC<PublishedContractProps> = ({
131131
<Divider />
132132

133133
<MarkdownRenderer
134-
px={6}
135-
pt={2}
136-
pb={5}
137134
markdownText={publishedContract?.changelog}
135+
className="px-6 pt-2 pb-5"
138136
/>
139137
</Card>
140138
)}

‎apps/dashboard/src/components/contract-components/published-contract/markdown-renderer.stories.tsx‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import { mobileViewport } from "../../../stories/utils";
3+
import { MarkdownRenderer } from "./markdown-renderer";
4+
5+
const meta = {
6+
title: "blocks/MarkdownRenderer",
7+
component: Story,
8+
parameters: {
9+
nextjs: {
10+
appDirectory: true,
11+
},
12+
},
13+
} satisfies Meta<typeof Story>;
14+
15+
export default meta;
16+
type Story = StoryObj<typeof meta>;
17+
18+
export const Desktop: Story = {
19+
args: {},
20+
};
21+
22+
export const DisableCodeHighlight: Story = {
23+
args: {
24+
disableCodeHighlight: true,
25+
},
26+
};
27+
28+
export const Mobile: Story = {
29+
args: {},
30+
parameters: {
31+
viewport: mobileViewport("iphone14"),
32+
},
33+
};
34+
35+
const markdownExample = `\
36+
# Heading 1
37+
## Heading 2
38+
### Heading 3
39+
#### Heading 4
40+
##### Heading 5
41+
###### Heading 6
42+
43+
44+
This a paragraph
45+
46+
This is another paragraph
47+
48+
This a very long paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec pur us. Donec euismod, nunc nec vehicula.
49+
ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec pur us. Donec euismod, nunc nec vehicula.
50+
51+
52+
## Empasis
53+
54+
*Italic text*
55+
_Also italic text_
56+
57+
**Bold text**
58+
__Also bold text__
59+
60+
***Bold and italic***
61+
___Also bold and italic___
62+
63+
## Blockquote
64+
> This is a blockquote.
65+
66+
## Lists
67+
68+
### Unordered list
69+
- Item 1
70+
- Item 2
71+
- Nested Item 1
72+
- Nested Item 2
73+
74+
### Ordered list
75+
1. First item
76+
2. Second item
77+
1. Sub-item 1
78+
2. Sub-item 2
79+
80+
### Mixed Nested lists
81+
82+
- Item 1
83+
- Item 2
84+
1. Sub-item 1
85+
2. Sub-item 2
86+
87+
88+
1. First item
89+
2. Second item
90+
- Sub-item 1
91+
- Sub-item 2
92+
93+
### Code
94+
This a a paragraph with some \`inlineCode()\`
95+
96+
This a \`const longerCodeSnippet = "Example. This should be able to handle line breaks as well, it should not be overflowing the page";\`
97+
98+
\`\`\`javascript
99+
// Code block with syntax highlighting
100+
function example() {
101+
console.log("Hello, world!");
102+
}
103+
\`\`\`
104+
105+
### Links
106+
[thirdweb](https://www.thirdweb.com)
107+
108+
### Images
109+
![Alt text](https://picsum.photos/2000/500)
110+
111+
112+
### Horizontal Rule
113+
114+
115+
116+
---
117+
118+
119+
120+
### Tables
121+
| Header 1 | Header 2 | Header 3 |
122+
|----------|----------|----------|
123+
| Row 1 | Data | More Data|
124+
| Row 2 | Data | More Data|
125+
126+
127+
| Column 1 | Column 2 | Column 3 | Column 4 | Column 5 |
128+
|--------------|------------------|--------------|------------------|--------------|
129+
| Row 1 Cell 1 | Row 1 Cell 2 | Row 1 Cell 3 | Row 1 Cell 4 | Row 1 Cell 5 |
130+
| Row 2 Cell 1 | Row 2 Cell 2 | Row 2 Cell 3 | Row 2 Cell 4 | Row 2 Cell 5 |
131+
| Row 3 Cell 1 | Row 3 Cell 2 | Row 3 Cell 3 | Row 3 Cell 4 | Row 3 Cell 5 |
132+
| Row 4 Cell 1 | Row 4 Cell 2 | Row 4 Cell 3 | Row 4 Cell 4 | Row 4 Cell 5 |
133+
| Row 5 Cell 1 | Row 5 Cell 2 | Row 5 Cell 3 | Row 5 Cell 4 | Row 5 Cell 5 |
134+
135+
136+
### Task List
137+
- [ ] Task 1
138+
- [x] Task 2 (completed)
139+
140+
### Escaping special characters
141+
\\*This text is not italicized.\\*
142+
143+
### Strikethrough
144+
~~This is strikethrough text.~~
145+
146+
147+
`;
148+
149+
function Story(props: {
150+
disableCodeHighlight?: boolean;
151+
}) {
152+
return (
153+
<div className="container max-w-[800px] py-10">
154+
<MarkdownRenderer
155+
markdownText={markdownExample}
156+
disableCodeHighlight={props.disableCodeHighlight}
157+
/>
158+
</div>
159+
);
160+
}

0 commit comments

Comments
 (0)