Skip to content

Commit d5698e9

Browse files
author
Vandita Patidar
committed
Web view
1 parent c9ab91e commit d5698e9

File tree

5 files changed

+140
-1
lines changed

5 files changed

+140
-1
lines changed

‎packages/core/src/awsService/appBuilder/serverlessLand/metadata.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
"s3-lambda-resizing-sam": {
44
"name": "Resizing image",
55
"description": "Lambda, S3 • Python, Javascript, Java, .NET • SAM",
6+
"gitUrl": "https://github.com/aws-samples/serverless-patterns/tree/main/s3-lambda-resizing-python",
67
"implementation": [
78
{
89
"iac": "sam",

‎packages/core/src/awsService/appBuilder/serverlessLand/metadataManager.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,10 @@ interface PatternData {
1717
implementation: Implementation[]
1818
}
1919

20+
interface PatternUrls {
21+
githubUrl: string
22+
previewUrl: string
23+
}
2024
export interface ProjectMetadata {
2125
patterns: Record<string, PatternData>
2226
}
@@ -117,6 +121,24 @@ export class MetadataManager {
117121
}))
118122
}
119123

124+
public getUrl(pattern: string): PatternUrls {
125+
const patternData = this.metadata?.patterns?.[pattern]
126+
if (!patternData || !patternData.implementation) {
127+
return {
128+
githubUrl: '',
129+
previewUrl: '',
130+
}
131+
}
132+
const asset = patternData.implementation[0].assetName
133+
134+
return {
135+
// GitHub URL for the pattern
136+
githubUrl: `https://github.com/aws-samples/serverless-patterns/tree/main/${asset}`,
137+
// Serverless Land preview URL
138+
previewUrl: `https://serverlessland.com/patterns/${asset}`,
139+
}
140+
}
141+
120142
/**
121143
* Gets available Infrastructure as Code options for a specific pattern
122144
* @param pattern The pattern name to get IaC options for

‎packages/core/src/awsService/appBuilder/serverlessLand/webViewManager.ts‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
/*!
2+
* Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3+
* SPDX-License-Identifier: Apache-2.0
4+
*/
5+
export class WebviewService {
6+
constructor() {}
7+
8+
public static getWebviewContent(url: string) {
9+
return `
10+
<!DOCTYPE html>
11+
<html lang="en">
12+
<head>
13+
<meta charset="UTF-8">
14+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
15+
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; frame-src ${url}; style-src 'unsafe-inline';">
16+
<style>
17+
body, html {
18+
margin: 0;
19+
padding: 0;
20+
width: 100%;
21+
height: 100vh;
22+
overflow: hidden;
23+
}
24+
iframe {
25+
width: 100%;
26+
height: 100%;
27+
border: none;
28+
}
29+
</style>
30+
</head>
31+
<body>
32+
<iframe src="${url}" frameborder="0" allowfullscreen></iframe>
33+
</body>
34+
</html>
35+
`
36+
}
37+
38+
public static getGitWebviewContent(url: string): string {
39+
const htmlContent = `
40+
<html>
41+
<head>
42+
<meta http-equiv="refresh" content="0; url=${url}">
43+
<style>
44+
body {
45+
display: flex;
46+
justify-content: center;
47+
align-items: center;
48+
height: 100vh;
49+
margin: 0;
50+
font-family: var(--vscode-font-family);
51+
}
52+
p {
53+
text-align: center;
54+
padding: 20px;
55+
}
56+
a {
57+
color: var(--vscode-textLink-foreground);
58+
text-decoration: none;
59+
}
60+
a:hover {
61+
text-decoration: underline;
62+
color: var(--vscode-textLink-activeForeground);
63+
}
64+
</style>
65+
</head>
66+
<body>
67+
<p>To preview GitHub page, <a href="${url}">click here</a>.</p>
68+
</body>
69+
</html>
70+
`
71+
return htmlContent
72+
}
73+
}

‎packages/core/src/awsService/appBuilder/serverlessLand/wizard.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ function promptPattern(metadataManager: MetadataManager) {
3232
throw new ToolkitError('No patterns found in metadata')
3333
}
3434

35-
return createQuickPick<string>(
35+
const quickPick = createQuickPick<string>(
3636
patterns.map((p) => ({
3737
label: p.label,
3838
detail: p.description,
@@ -56,6 +56,8 @@ function promptPattern(metadataManager: MetadataManager) {
5656
matchOnDetail: true,
5757
}
5858
)
59+
60+
return quickPick
5961
}
6062

6163
function promptRuntime(metadataManager: MetadataManager, pattern: string | undefined) {

‎packages/core/src/shared/ui/pickerPrompter.ts‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ import { Prompter, PromptResult, Transform } from './prompter'
1212
import { assign, isAsyncIterable } from '../utilities/collectionUtils'
1313
import { recentlyUsed } from '../localizedText'
1414
import { getLogger } from '../logger/logger'
15+
import { MetadataManager } from '../../awsService/appBuilder/serverlessLand/metadataManager'
16+
import { WebviewService } from '../../awsService/appBuilder/serverlessLand/webViewManager'
1517

1618
const localize = nls.loadMessageBundle()
1719

@@ -143,6 +145,45 @@ export function createQuickPick<T>(
143145
assign(mergedOptions, picker)
144146
picker.buttons = mergedOptions.buttons ?? []
145147

148+
picker.onDidTriggerItemButton(async (event) => {
149+
const metadataManager = MetadataManager.getInstance()
150+
if (event.button.tooltip === 'Open in GitHub' || event.button.tooltip === 'Open in Serverless Land') {
151+
const selectedPattern = event.item
152+
if (selectedPattern) {
153+
const patternUrl = metadataManager.getUrl(selectedPattern.label)
154+
if (patternUrl) {
155+
if (event.button.tooltip === 'Open in GitHub') {
156+
const panel = vscode.window.createWebviewPanel(
157+
'githubPreview',
158+
`GitHub Repository ${selectedPattern.label}`,
159+
vscode.ViewColumn.One,
160+
{
161+
enableScripts: true,
162+
retainContextWhenHidden: true,
163+
enableCommandUris: true,
164+
enableFindWidget: true,
165+
}
166+
)
167+
panel.webview.html = WebviewService.getGitWebviewContent(patternUrl.githubUrl)
168+
} else if (event.button.tooltip === 'Open in Serverless Land') {
169+
const panel = vscode.window.createWebviewPanel(
170+
'serverlessLandPreview',
171+
'Serverless Land Preview',
172+
vscode.ViewColumn.One,
173+
{
174+
enableScripts: true,
175+
retainContextWhenHidden: true,
176+
enableCommandUris: true,
177+
enableFindWidget: true,
178+
}
179+
)
180+
panel.webview.html = WebviewService.getWebviewContent(patternUrl.previewUrl)
181+
}
182+
}
183+
}
184+
}
185+
})
186+
146187
const prompter =
147188
mergedOptions.filterBoxInputSettings !== undefined
148189
? new FilterBoxQuickPickPrompter<T>(picker, mergedOptions)

0 commit comments

Comments
 (0)