From 7a4b4e0ef67f5c262e03cd9a7282577ad10ee0a6 Mon Sep 17 00:00:00 2001 From: KaviiSuri Date: Wed, 6 Nov 2024 02:24:48 +0530 Subject: [PATCH 1/5] fix: ui fixes for playground --- .../components/Playground/Playground.tsx | 10 ++-- .../components/Playground/TerminalUI.tsx | 28 +++++---- .../components/Search/CommandPage.tsx | 4 +- .../components/Search/SearchBox.tsx | 58 ++++++++++++++----- tooling/eslint-config/package.json | 6 +- 5 files changed, 72 insertions(+), 34 deletions(-) diff --git a/apps/playground-web/components/Playground/Playground.tsx b/apps/playground-web/components/Playground/Playground.tsx index be92aa2..bdf9011 100644 --- a/apps/playground-web/components/Playground/Playground.tsx +++ b/apps/playground-web/components/Playground/Playground.tsx @@ -10,24 +10,24 @@ export default function Playground() { return (
-
+
diff --git a/apps/playground-web/components/Playground/TerminalUI.tsx b/apps/playground-web/components/Playground/TerminalUI.tsx index d279b79..754a49b 100644 --- a/apps/playground-web/components/Playground/TerminalUI.tsx +++ b/apps/playground-web/components/Playground/TerminalUI.tsx @@ -15,7 +15,10 @@ export function TerminalUI({ initialCommandsLeft = 1000 }) { return ( <> -
+
@@ -24,7 +27,7 @@ export function TerminalUI({ initialCommandsLeft = 1000 }) {
@@ -50,26 +53,31 @@ function TerminalCounter({
- Cleanup in: {formatTime(cleanupTimeLeft)} mins + + + Cleanup in:{' '} + {formatTime(cleanupTimeLeft)} mins +
-
- Commands left: {commandsLeft} + {' '} + + Commands left: + {commandsLeft} +
- {' '} - {/* Tooltip next to text */}
-
+

DiceDB instance is shared across all users. diff --git a/apps/playground-web/components/Search/CommandPage.tsx b/apps/playground-web/components/Search/CommandPage.tsx index de7ddda..123a580 100644 --- a/apps/playground-web/components/Search/CommandPage.tsx +++ b/apps/playground-web/components/Search/CommandPage.tsx @@ -31,7 +31,7 @@ export default function CommandPage({ return (

{syntax} diff --git a/apps/playground-web/components/Search/SearchBox.tsx b/apps/playground-web/components/Search/SearchBox.tsx index 032521a..18535d8 100644 --- a/apps/playground-web/components/Search/SearchBox.tsx +++ b/apps/playground-web/components/Search/SearchBox.tsx @@ -16,8 +16,11 @@ export default function SearchBox() { ); return ( -
-
+
+
-
- {search.length > 1 && - filteredCommands.map((cmdMeta) => ( - - ))} +
+ {filteredCommands.map((cmdMeta) => ( + + ))} + {filteredCommands.length === 0 && }
); } + +const NotFoundPage = () => { + return ( +
+

+ No matching data was found🥺 +

+ +
+

+ Try refining your search or browse the documentation for common + commands. +

+
+ + View Documentation + +
+ ); +}; diff --git a/tooling/eslint-config/package.json b/tooling/eslint-config/package.json index c53bbfb..39e8164 100644 --- a/tooling/eslint-config/package.json +++ b/tooling/eslint-config/package.json @@ -8,12 +8,12 @@ "react-internal.js" ], "devDependencies": { + "@typescript-eslint/eslint-plugin": "^7.1.0", + "@typescript-eslint/parser": "^7.1.0", "@vercel/style-guide": "^5.2.0", - "eslint-config-turbo": "^2.0.0", "eslint-config-prettier": "^9.1.0", + "eslint-config-turbo": "^2.0.0", "eslint-plugin-only-warn": "^1.1.0", - "@typescript-eslint/parser": "^7.1.0", - "@typescript-eslint/eslint-plugin": "^7.1.0", "typescript": "^5.3.3" } } From 966cf4d5ec63db84c69a42ece1c44c803d8defda Mon Sep 17 00:00:00 2001 From: KaviiSuri Date: Wed, 6 Nov 2024 12:31:53 +0530 Subject: [PATCH 2/5] fix: formatting --- apps/playground-web/components/Search/SearchBox.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/apps/playground-web/components/Search/SearchBox.tsx b/apps/playground-web/components/Search/SearchBox.tsx index 18535d8..38bc99d 100644 --- a/apps/playground-web/components/Search/SearchBox.tsx +++ b/apps/playground-web/components/Search/SearchBox.tsx @@ -52,9 +52,7 @@ export default function SearchBox() { const NotFoundPage = () => { return ( -
+

No matching data was found🥺

From 87ed84ae0c7a7ee81782bbfa7fbb7e6a224bba80 Mon Sep 17 00:00:00 2001 From: KaviiSuri Date: Wed, 6 Nov 2024 21:02:18 +0530 Subject: [PATCH 3/5] fix: tests --- .../components/Playground/TerminalUI.tsx | 4 ++-- .../components/Search/__tests__/SearchBox.test.tsx | 11 ++--------- 2 files changed, 4 insertions(+), 11 deletions(-) diff --git a/apps/playground-web/components/Playground/TerminalUI.tsx b/apps/playground-web/components/Playground/TerminalUI.tsx index 754a49b..3311c53 100644 --- a/apps/playground-web/components/Playground/TerminalUI.tsx +++ b/apps/playground-web/components/Playground/TerminalUI.tsx @@ -58,7 +58,7 @@ function TerminalCounter({ > - Cleanup in:{' '} + Cleanup in: {formatTime(cleanupTimeLeft)} mins
@@ -71,7 +71,7 @@ function TerminalCounter({ > {' '} - Commands left: + Commands left: {commandsLeft}
diff --git a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx index aebdfec..47799fa 100644 --- a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx +++ b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx @@ -82,14 +82,7 @@ describe('SearchBox Component', () => { } }); - it('should not show results when search length is less than 2', async () => { - const { searchInputElement } = setupTest(); - await userEvent.type(searchInputElement, 'A'); - - Object.values(DiceCmds).forEach((cmd) => { - expect( - screen.queryByText(new RegExp(cmd.title, 'i')), - ).not.toBeInTheDocument(); - }); + it('should show results when search length is 0', async () => { + expect(screen.getAllByTestId('command-title').length).toBeGreaterThan(0); }); }); From 0ef8ba1c7d51425cd3160cb07f68a93f5c0d4c9d Mon Sep 17 00:00:00 2001 From: pshubham Date: Wed, 11 Dec 2024 22:53:22 +0530 Subject: [PATCH 4/5] Fix unit test failing --- .../Search/__tests__/SearchBox.test.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx index 47799fa..b21c0ad 100644 --- a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx +++ b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx @@ -82,7 +82,21 @@ describe('SearchBox Component', () => { } }); - it('should show results when search length is 0', async () => { - expect(screen.getAllByTestId('command-title').length).toBeGreaterThan(0); + it('should show all commands when search length is 0', async () => { + const { searchInputElement } = setupTest(); + + // Check that all commands are rendered when the search is empty + expect(searchInputElement).toBeInTheDocument(); + + // Count the number of commands in DiceCmds + const totalCommands = Object.values(DiceCmds).length; + + // Use querySelectorAll for more advanced filtering + const displayedCommands = Array.from( + screen.getByTestId('search-container').querySelectorAll('[data-testid^="command-page"]') + ); + + // Ensure the displayed commands match the total + expect(displayedCommands).toHaveLength(totalCommands); }); }); From 63a706ad948f99b6d5af6e4b8f5b74e42192f3a0 Mon Sep 17 00:00:00 2001 From: pshubham Date: Wed, 11 Dec 2024 22:56:33 +0530 Subject: [PATCH 5/5] Fix lint --- .../components/Search/__tests__/SearchBox.test.tsx | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) diff --git a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx index b21c0ad..d6bd507 100644 --- a/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx +++ b/apps/playground-web/components/Search/__tests__/SearchBox.test.tsx @@ -84,19 +84,13 @@ describe('SearchBox Component', () => { it('should show all commands when search length is 0', async () => { const { searchInputElement } = setupTest(); - - // Check that all commands are rendered when the search is empty expect(searchInputElement).toBeInTheDocument(); - - // Count the number of commands in DiceCmds const totalCommands = Object.values(DiceCmds).length; - - // Use querySelectorAll for more advanced filtering const displayedCommands = Array.from( - screen.getByTestId('search-container').querySelectorAll('[data-testid^="command-page"]') + screen + .getByTestId('search-container') + .querySelectorAll('[data-testid^="command-page"]'), ); - - // Ensure the displayed commands match the total expect(displayedCommands).toHaveLength(totalCommands); }); });