From dbc26df7f45bfda2c1e82e587f2a53d4e9d2d977 Mon Sep 17 00:00:00 2001 From: Eric Cabrel TIOGO Date: Mon, 17 Oct 2022 22:48:09 +0200 Subject: [PATCH] feat(embed): handle snippet not found --- .github/workflows/deploy-code-embed.yml | 1 + apps/functions/code-embed/.env.template | 3 +- apps/functions/code-embed/serverless.ts | 1 + .../src/functions/renderer/handler.ts | 2 + packages/embed/.env.template | 1 + packages/embed/env.d.ts | 1 + .../src/renderer/content/preview-template.ts | 2 +- .../content/tests/html-generator.test.ts | 18 ++++- .../content/tests/preview-template.test.ts | 73 ++++++++++++++++++- .../src/renderer/content/tests/utils.test.ts | 19 ++++- packages/embed/src/renderer/index.ts | 4 +- packages/embed/src/server/index.ts | 1 + 12 files changed, 116 insertions(+), 10 deletions(-) diff --git a/.github/workflows/deploy-code-embed.yml b/.github/workflows/deploy-code-embed.yml index 3663a907..5dfe94ef 100644 --- a/.github/workflows/deploy-code-embed.yml +++ b/.github/workflows/deploy-code-embed.yml @@ -19,6 +19,7 @@ jobs: EMBED_STYLE_URL: ${{ secrets.EMBED_STYLE_URL }} EMBED_JS_URL: ${{ secrets.EMBED_JS_URL }} WEB_APP_URL: ${{ secrets.WEB_APP_URL }} + WEB_APP_SNIPPET_VIEW_URL: ${{ secrets.WEB_APP_SNIPPET_VIEW_URL }} ENV: ${{ secrets.ENV }} SENTRY_DSN: ${{ secrets.CODE_EMBED_SENTRY_DSN }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} diff --git a/apps/functions/code-embed/.env.template b/apps/functions/code-embed/.env.template index 71211507..c0b18749 100644 --- a/apps/functions/code-embed/.env.template +++ b/apps/functions/code-embed/.env.template @@ -1,6 +1,7 @@ DATABASE_URL="mysql://root:@127.0.0.1:3311/sharingan" EMBED_STYLE_URL=https://cdn.jsdelivr.net/npm/sharingan-embed@latest/style.min.css EMBED_JS_URL=https://cdn.jsdelivr.net/npm/sharingan-embed@latest/script.min.js -WEB_APP_URL=http://localhost:7500 ENV=development SENTRY_DSN= +WEB_APP_URL=http://localhost:7500 +WEB_APP_SNIPPET_VIEW_URL=http://localhost:7500/snippets diff --git a/apps/functions/code-embed/serverless.ts b/apps/functions/code-embed/serverless.ts index 860dd7bd..7e8d5e5f 100644 --- a/apps/functions/code-embed/serverless.ts +++ b/apps/functions/code-embed/serverless.ts @@ -68,6 +68,7 @@ const serverlessConfiguration: AWS = { ENV: '${env:ENV}', NODE_OPTIONS: '--stack-trace-limit=1000', SENTRY_DSN: '${env:SENTRY_DSN}', + WEB_APP_SNIPPET_VIEW_URL: '${env:WEB_APP_SNIPPET_VIEW_URL}', WEB_APP_URL: '${env:WEB_APP_URL}', }, name: 'aws', diff --git a/apps/functions/code-embed/src/functions/renderer/handler.ts b/apps/functions/code-embed/src/functions/renderer/handler.ts index c65fbee4..5571e2ad 100644 --- a/apps/functions/code-embed/src/functions/renderer/handler.ts +++ b/apps/functions/code-embed/src/functions/renderer/handler.ts @@ -19,6 +19,8 @@ export const main: Handler = async options: { scriptUrl: process.env.EMBED_JS_URL, styleUrl: process.env.EMBED_STYLE_URL, + webAppUrl: process.env.WEB_APP_URL, + webAppViewUrl: process.env.WEB_APP_SNIPPET_VIEW_URL, }, shiki, snippet, diff --git a/packages/embed/.env.template b/packages/embed/.env.template index 84c54a1c..db45e369 100644 --- a/packages/embed/.env.template +++ b/packages/embed/.env.template @@ -2,3 +2,4 @@ DATABASE_URL="mysql://root:@127.0.0.1:3311/sharingan" EMBED_STYLE_URL=http://localhost:7502/sharingan/style.css EMBED_JS_URL=http://localhost:7502/sharingan/script.js WEB_APP_URL=http://localhost:7500 +WEB_APP_SNIPPET_VIEW_URL=http://localhost:7500/snippets diff --git a/packages/embed/env.d.ts b/packages/embed/env.d.ts index 12a25cb2..f22295e3 100644 --- a/packages/embed/env.d.ts +++ b/packages/embed/env.d.ts @@ -3,6 +3,7 @@ export type EnvironmentVariables = { EMBED_JS_URL: string; EMBED_STYLE_URL: string; WEB_APP_URL: string; + WEB_APP_SNIPPET_VIEW_URL: string; }; declare global { diff --git a/packages/embed/src/renderer/content/preview-template.ts b/packages/embed/src/renderer/content/preview-template.ts index af3a3d09..4f6f3133 100644 --- a/packages/embed/src/renderer/content/preview-template.ts +++ b/packages/embed/src/renderer/content/preview-template.ts @@ -1,6 +1,6 @@ import { generateRandomString } from './utils'; -type Args = { +export type Args = { code: string; color?: string; rawCode: string; diff --git a/packages/embed/src/renderer/content/tests/html-generator.test.ts b/packages/embed/src/renderer/content/tests/html-generator.test.ts index 168b1a0b..596877a0 100644 --- a/packages/embed/src/renderer/content/tests/html-generator.test.ts +++ b/packages/embed/src/renderer/content/tests/html-generator.test.ts @@ -1,5 +1,19 @@ +import { generateNoSnippetHtmlContent } from '../html-generator'; + describe('Test HTML generator functions', () => { - it('should generates html content for a non existing code snippet', () => {}); + it.only('should generates html content for a non existing code snippet', () => { + // GIVEN + const WEB_APP_URL = 'https://sharingan.dev'; + + // WHEN + const result = generateNoSnippetHtmlContent(WEB_APP_URL); - it('should generates html content for a code snippet', () => {}); + // THEN + expect(result).toMatchInlineSnapshot(` + "
+

Oops! Snippet not found!

+
Go to Sharingan to ensure it exists and is accessible
+
" + `); + }); }); diff --git a/packages/embed/src/renderer/content/tests/preview-template.test.ts b/packages/embed/src/renderer/content/tests/preview-template.test.ts index 2df93aad..885a5fa9 100644 --- a/packages/embed/src/renderer/content/tests/preview-template.test.ts +++ b/packages/embed/src/renderer/content/tests/preview-template.test.ts @@ -1,5 +1,74 @@ +import { Args, generateHTMLPreview } from '../preview-template'; + describe('Test generateHTMLPreview()', () => { - it('should generates the html preview for a non existing code snippet', () => {}); + it('should generates the html preview for a code snippet', () => { + // GIVEN + const args: Args = { + code: + 'export const hashPassword = (password: string): string => {\n' + + ' const SALT_ROUNDS = 10;\n' + + '\n' + + ' return bcrypt.hashSync(password, SALT_ROUNDS);\n' + + '};', + color: '#f5f5f5', + rawCode: + 'export const hashPassword = (password: string): string => {\n' + + ' const SALT_ROUNDS = 10;\n' + + '\n' + + ' return bcrypt.hashSync(password, SALT_ROUNDS);\n' + + '};', + scriptUrl: 'https://cdn.com/sharigan/script.js', + styleUrl: 'https://cdn.com/sharigan/style.css', + title: 'helpers.ts', + webAppUrl: 'https://sharingan.dev', + }; + + // WHEN + const result = generateHTMLPreview(args); + + // THEN + expect(result).toMatchInlineSnapshot(` + " + + + + + + + Sharingan - helpers.ts + + + +
+
+
helpers.ts
+
view on Sharingan
+
+ +
+ + 
export const hashPassword = (password: string): string => {
+        const SALT_ROUNDS = 10;
+      
+        return bcrypt.hashSync(password, SALT_ROUNDS);
+      };
+
+
+ + + + " + `); + }); }); diff --git a/packages/embed/src/renderer/content/tests/utils.test.ts b/packages/embed/src/renderer/content/tests/utils.test.ts index d57d0cd5..38b60729 100644 --- a/packages/embed/src/renderer/content/tests/utils.test.ts +++ b/packages/embed/src/renderer/content/tests/utils.test.ts @@ -1,4 +1,4 @@ -import { addWhitespaceForEmptyLine, generateLineHighlightOptions } from '../utils'; +import { addWhitespaceForEmptyLine, generateLineHighlightOptions, parseHTMLSnippetCode } from '../utils'; describe('Test utils functions', () => { describe('Test addWhitespaceForEmptyLine()', () => { @@ -36,7 +36,7 @@ describe('Test utils functions', () => { }); }); - describe.only('Test generateLineHighlightOptions()', () => { + describe('Test generateLineHighlightOptions()', () => { it('should generate no line highlight options from a null string', () => { // GIVEN const lineHighlight: string | null = null; @@ -77,5 +77,18 @@ describe('Test utils functions', () => { }); }); - describe('Test parseHTMLSnippetCode()', () => {}); + describe('Test parseHTMLSnippetCode()', () => { + it('should parse html snippet code', () => { + // GIVEN + const htmlCode = `
line code 1\n\nline code 3
`; + + // WHEN + const result = parseHTMLSnippetCode(htmlCode); + + // THEN + expect(result).toEqual( + `1line code 1\n2  \n3line code 3`, + ); + }); + }); }); diff --git a/packages/embed/src/renderer/index.ts b/packages/embed/src/renderer/index.ts index c6630b8a..7db31b18 100644 --- a/packages/embed/src/renderer/index.ts +++ b/packages/embed/src/renderer/index.ts @@ -9,6 +9,7 @@ type Args = { scriptUrl: string; styleUrl: string; webAppUrl: string; + webAppViewUrl: string; }; shiki: Shiki; snippet: Snippet | null; @@ -18,6 +19,7 @@ export const renderSnippetToHtml = async ({ options, shiki, snippet }: Args): Pr const STYLE_URL = options.styleUrl; const SCRIPT_URL = options.scriptUrl; const WEBAPP_URL = options.webAppUrl; + const WEBAPP_VIEW_URL = options.webAppViewUrl; if (!snippet) { const code = generateNoSnippetHtmlContent(WEBAPP_URL); @@ -41,6 +43,6 @@ export const renderSnippetToHtml = async ({ options, shiki, snippet }: Args): Pr scriptUrl: SCRIPT_URL, styleUrl: STYLE_URL, title: snippet.name, - webAppUrl: WEBAPP_URL, + webAppUrl: `${WEBAPP_VIEW_URL}/${snippet.id}`, }); }; diff --git a/packages/embed/src/server/index.ts b/packages/embed/src/server/index.ts index f1a3901e..10416b01 100644 --- a/packages/embed/src/server/index.ts +++ b/packages/embed/src/server/index.ts @@ -36,6 +36,7 @@ export const startServer = async () => { scriptUrl: process.env.EMBED_JS_URL, styleUrl: process.env.EMBED_STYLE_URL, webAppUrl: process.env.WEB_APP_URL, + webAppViewUrl: process.env.WEB_APP_SNIPPET_VIEW_URL, }, shiki, snippet,