Blocked repositories page improvements #12438

filiptronicek · 2022-08-26T12:20:50Z

Description

Fixes some issues on inside https://github.com/gitpod-io/gitpod/blob/main/components/dashboard/src/admin/BlockedRepositories.tsx. Details are outlined below this comment.

Related Issue(s)

n/a

How to test

Release Notes

NONE

Documentation

Werft options:

/werft with-preview

filiptronicek · 2022-08-26T12:21:21Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -135,7 +135,7 @@ export function BlockedRepositoriesList(props: Props) {
                        </div>
                        <input
                            type="search"
-                            placeholder="Search by URL Regex"
+                            placeholder="Search by URL RegEx"


Made it so that we have the same capitalization everywhere

praise: Nice catch! ⚾

filiptronicek · 2022-08-26T12:22:02Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -148,8 +148,10 @@ export function BlockedRepositoriesList(props: Props) {
                </div>
            </div>

-            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 w-2/3 mb-2 w-full">
-                <span>Search entries by their Repositoriy URL regular expression (RegEx).</span>
+            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 mb-2 w-full">


Here there was an extra class which was not used because w-full already changed the width.

praise: Thanks for noticing! 👀

filiptronicek · 2022-08-26T12:22:51Z

components/dashboard/src/admin/BlockedRepositories.tsx

-                <span>Search entries by their Repositoriy URL regular expression (RegEx).</span>
+            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 mb-2 w-full">
+                <span>
+                    Search entries by their repository URL <abbr title="regular expression">RegEx</abbr>.


Here besides fixing a typo, an abbreviation was added so that we both save space and utilize semantic HTML for abbreviations.

thought: Not particularly proud of how this is rendering by default (see screenshots below) or using this controversial abbreviation design pattern[1] as it comes with some accessibility concerns, but let's keep it for now until we have a better way to present this information. 🤝

Chrome Firefox Safari

Thanks for introducing me to Microformats! It's a really great guide from what I'm seeing.

werft-gitpod-dev-com · 2022-08-26T12:23:21Z

started the job as gitpod-build-ft-blocked-repos-improvements.1 because the annotations in the pull request description changed
(with .werft/ from main)

filiptronicek · 2022-08-26T12:27:48Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -211,7 +213,7 @@ function AddBlockedRepositoryModal(p: AddBlockedRepositoryModalProps) {
        setError("");
    }, [p.blockedRepository]);

-    let save = (): boolean => {
+    const save = (): boolean => {


Use const where possible

thought: Sounds legit and good, especially since @easyCZ from @gitpod-io/engineering-webapp already approved these changes. 🏓

easyCZ

LGTM. Adding hold in case you want @gtsiolis to review for UI.

/hold

gtsiolis · 2022-08-26T14:56:19Z

Looking at this now! 👀

gtsiolis

Thanks @filiptronicek for making this change, @svenefftinge for the ping[1], and @easyCZ for taking a look[2]! 🏀

LGTM!

Took longer to come back to this after today's tech talk (internal) because of some spaghetti I had to make. 🍝

gtsiolis · 2022-08-26T12:35:39Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -135,7 +135,7 @@ export function BlockedRepositoriesList(props: Props) {
                        </div>
                        <input
                            type="search"
-                            placeholder="Search by URL Regex"
+                            placeholder="Search by URL RegEx"


praise: Nice catch! ⚾

gtsiolis · 2022-08-26T12:36:39Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -148,8 +148,10 @@ export function BlockedRepositoriesList(props: Props) {
                </div>
            </div>

-            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 w-2/3 mb-2 w-full">
-                <span>Search entries by their Repositoriy URL regular expression (RegEx).</span>
+            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 mb-2 w-full">


praise: Thanks for noticing! 👀

gtsiolis · 2022-08-26T12:37:37Z

components/dashboard/src/admin/BlockedRepositories.tsx

@@ -211,7 +213,7 @@ function AddBlockedRepositoryModal(p: AddBlockedRepositoryModalProps) {
        setError("");
    }, [p.blockedRepository]);

-    let save = (): boolean => {
+    const save = (): boolean => {


thought: Sounds legit and good, especially since @easyCZ from @gitpod-io/engineering-webapp already approved these changes. 🏓

gtsiolis · 2022-08-26T22:41:35Z

components/dashboard/src/admin/BlockedRepositories.tsx

-                <span>Search entries by their Repositoriy URL regular expression (RegEx).</span>
+            <Alert type={"info"} closable={false} showIcon={true} className="flex rounded p-2 mb-2 w-full">
+                <span>
+                    Search entries by their repository URL <abbr title="regular expression">RegEx</abbr>.


thought: Not particularly proud of how this is rendering by default (see screenshots below) or using this controversial abbreviation design pattern[1] as it comes with some accessibility concerns, but let's keep it for now until we have a better way to present this information. 🤝

Chrome Firefox Safari

gtsiolis · 2022-08-26T22:44:37Z

/unhold

filiptronicek requested a review from a team August 26, 2022 12:20

roboquat added the release-note-none label Aug 26, 2022

github-actions bot added the team: webapp Issue belongs to the WebApp team label Aug 26, 2022

roboquat added the size/XS label Aug 26, 2022

filiptronicek commented Aug 26, 2022

View reviewed changes

Blocked repositories page improvements

2f4bc9f

filiptronicek force-pushed the ft/blocked-repos-improvements branch from 4a6418e to 2f4bc9f Compare August 26, 2022 12:27

roboquat added size/S and removed size/XS labels Aug 26, 2022

filiptronicek commented Aug 26, 2022

View reviewed changes

svenefftinge requested a review from gtsiolis August 26, 2022 12:28

easyCZ approved these changes Aug 26, 2022

View reviewed changes

roboquat added the do-not-merge/hold label Aug 26, 2022

gtsiolis approved these changes Aug 26, 2022

View reviewed changes

roboquat removed the do-not-merge/hold label Aug 26, 2022

roboquat merged commit 5080e98 into main Aug 26, 2022

roboquat deleted the ft/blocked-repos-improvements branch August 26, 2022 22:45

roboquat added deployed: webapp Meta team change is running in production deployed Change is completely running in production labels Aug 29, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Blocked repositories page improvements #12438

Blocked repositories page improvements #12438

filiptronicek commented Aug 26, 2022 •

edited

Loading

filiptronicek Aug 26, 2022

gtsiolis Aug 26, 2022

filiptronicek Aug 26, 2022

gtsiolis Aug 26, 2022

filiptronicek Aug 26, 2022

gtsiolis Aug 26, 2022

filiptronicek Aug 26, 2022

werft-gitpod-dev-com bot commented Aug 26, 2022

filiptronicek Aug 26, 2022

gtsiolis Aug 26, 2022

easyCZ left a comment •

edited

Loading

gtsiolis commented Aug 26, 2022 •

edited by werft-gitpod-dev-com bot

Loading

gtsiolis left a comment

gtsiolis Aug 26, 2022

gtsiolis Aug 26, 2022

gtsiolis Aug 26, 2022

gtsiolis Aug 26, 2022

gtsiolis commented Aug 26, 2022

Blocked repositories page improvements #12438

Blocked repositories page improvements #12438

Conversation

filiptronicek commented Aug 26, 2022 • edited Loading

Description

Related Issue(s)

How to test

Release Notes

Documentation

Werft options:

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

werft-gitpod-dev-com bot commented Aug 26, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

easyCZ left a comment • edited Loading

Choose a reason for hiding this comment

gtsiolis commented Aug 26, 2022 • edited by werft-gitpod-dev-com bot Loading

gtsiolis left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gtsiolis commented Aug 26, 2022

filiptronicek commented Aug 26, 2022 •

edited

Loading

easyCZ left a comment •

edited

Loading

gtsiolis commented Aug 26, 2022 •

edited by werft-gitpod-dev-com bot

Loading