Code insights: Add new repositories UI field by vovakulikov · Pull Request #45687 · sourcegraph/sourcegraph-public-snapshot

vovakulikov · 2022-12-15T01:19:01Z

Closes https://github.com/sourcegraph/sourcegraph/issues/45427

Useful links

How to test

Locally

Check out this PR branch
Run sg start web-standalone or any other command that runs FE locally
After that you should be able to see new insight creation UI (by default it's two fields for the repo section)
You can change to the "one field approach" by editing codeInsightsRepoUI experimental feature flag in the setting (possible values "single-search-query", "search-query-or-strict-list")

Remote

Go to the special staging here
You should see the new repo UI there, you can change UI variation in the same way as it's described in the "Local" section above.

Backround

This PR changes the repositories UI field for the insight creation UI (search-based and capture group insight creation forms). It adds a new field UI that can be run in two different modes.

Single repositories search UI (you can see this mode with codeInsightsRepoUI: 'single-search-query' in experimentalFeatures setting cascade section)

And repositories search UI + direct list URLs field (the one that we had before this PR) (you can see this mode with codeInsightsRepoUI: 'search-query-or-strict-list', in experimentalFeatures setting cascade section)

Todo list

Add setting cascade feature flag
Implement both modes of UI
Add logic for the edit UI (before this PR, we had all repositories mode checkbox, new modes don't have it, in case of all repositories mode is on, we add repo:.* to the search repositories query field which should be fully equivalent to the all repos mode that we had before)
Fix 1-click creation flow for the search-based info (now we just put all repo-related filters to the search repo query field and put the rest of the query from the search result page in the first series query field)
Connect new UI to the new strat-scoped API handlers - repo query BE validation handler, repositories count info and live preview API
Add validation info to the new repositories section in the form (how many repositories were resolved by a given repositories query (search repo query field value)

Test plan

Check that the new UI works and looks as expected
Check that the 1-click creation flow works as expected
Check that editing functionality works as it worked before (especially check that all repositories mode has a proper fallback on the repo:.* value in the search repo field
Check that insight templates work as they worked before without any runtime or missing field problems.

App preview:

Web

Check out the client app preview documentation to learn more.

sg-e2e-regression-test-bob · 2022-12-15T01:27:03Z

Bundle size report 📦

Initial size	Total size	Async size	Modules
0.03% (+0.70 kb)	0.07% (+9.97 kb) 🔺	0.08% (+9.27 kb)	0.14% (+1) 🔺

Look at the Statoscope report for a full comparison between the commits 3437b94 and 936ad3e or learn more.

Open explanation

Initial size is the size of the initial bundle (the one that is loaded when you open the page)
Total size is the size of the initial bundle + all the async loaded chunks
Async size is the size of all the async loaded chunks
Modules is the number of modules in the initial bundle

chwarwick · 2022-12-20T14:23:11Z

@vovakulikov I didn't make it all the way though this but did see a small issue in the create. If you have data in both a repo search and a list of repos it sends both to the mutation. The mutation rejects it because it's not sure which one is correct.

chwarwick · 2022-12-20T14:35:52Z

Another thing I noticed is that entering repo: and selecting a repo suggestion doesn't add the regex anchors like it does in the regular search input. So I end up with repo:github.com/sourcegraph/sourcegraph instead of repo:^github\.com/sourcegraph/sourcegraph$

AlicjaSuska

Thank you for making those changes @vovakulikov (I love that the repo count works! It's awesome). Here is the design QA page with all the design details I've spotted.

valerybugakov

Tested the feature locally and left a couple of optional comments!

valerybugakov · 2023-01-13T04:55:31Z

+    // required
+    const isRepoURLsListRequired = isSearchQueryORUrlsList && isURLsListMode
+
+    const validateRepoQuerySyntax = useMemo(() => createValidateRepoQuerySyntax(apolloClient), [apolloClient])


Would useLazyQuery work here instead of useApolloClient?

Yeah I think it would work, but I still would have needed wrap it with useMemo because field validator API expects to have boolean from validation function and validators always should be not re-rendered on each render call otherwise it all will fail with recursive error.

valerybugakov · 2023-01-13T06:16:24Z

+    InputDescription,
+    InputErrorMessage,
+    InputElement,


What are the reasons for exposing these components? Would it be possible to implement the same functionality relying only on the Input component?

Context: we discussed exposing these earlier while we worked on the Wildcard v2 and decided to export only the higher level Input component to keep things consistent in the UI because it would limit the number of combinations that consumers can create (e.g., label + input + error + description). Understanding the motivation behind lowering the abstraction level here would be great.

Yeah, basically I had to have this element, because Input component for example always returns wrapped with LoadingInput component layout. Sometimes it returns wrapped with Label layout. I see that consistency here is already broken. You have to care about different input layout combination every time you use Input element.

For my particular case I use Searchbox Input with standard Input layout (error message, label, etc) The search box itself provides loading state, in order to decouple loading from Input component I extracted Input Element.

Also in my case I need to put preview button in one line with input and that error or description message were below this line with input and preview button, with current Input API this ins't possible, I could extend it but I would have became even more complicated rather than now. So I decide that low-level abstractions here are necessary.

sourcegraph-bot · 2023-01-13T16:58:09Z

Codenotify: Notifying subscribers in CODENOTIFY files for diff c8f520b...3437b94.

Notify	File(s)
@limitedmage	client/web/src/enterprise/code-monitoring/components/snapshots/FormActionArea.test.tsx.snap

sourcegraph-bot · 2023-01-13T16:58:51Z

Codenotify: Notifying subscribers in OWNERS files for diff c8f520b...3437b94.

Notify	File(s)
@sourcegraph/code-exploration-devs	client/common/src/util/string.test.ts client/common/src/util/strings.ts client/wildcard/src/components/Combobox/Combobox.tsx client/wildcard/src/components/Form/Input/Input.module.scss client/wildcard/src/components/Form/Input/Input.story.tsx client/wildcard/src/components/Form/Input/Input.test.tsx client/wildcard/src/components/Form/Input/Input.tsx client/wildcard/src/components/Form/Input/snapshots/Input.test.tsx.snap client/wildcard/src/components/index.ts

github-actions · 2023-01-13T17:50:58Z

❌ Problem: the label i-acknowledge-this-goes-into-the-release is absent.
👉 What to do: we're in the next Sourcegraph release code freeze period. If you are 100% sure your changes should get released or provide no risk to the release, add the label your PR with i-acknowledge-this-goes-into-the-release.

…ration

…e mutation

…ght-repo-section/InsightRepoSection.tsx Co-authored-by: chwarwick <christopher.warwick@sourcegraph.com>

cla-bot Bot added the cla-signed label Dec 15, 2022

vovakulikov self-assigned this Dec 15, 2022

vovakulikov force-pushed the vk/new-insight-repo-ui branch from 764d7e0 to 5297863 Compare December 16, 2022 17:18

vovakulikov requested review from AlicjaSuska, chwarwick and leonore December 16, 2022 20:39

vovakulikov force-pushed the vk/new-insight-repo-ui branch from 9a3a303 to aea9f6c Compare December 19, 2022 18:32

vovakulikov mentioned this pull request Dec 20, 2022

Code Insights: Add new code insight repo UI experimental feature flag #45830

Merged

chwarwick reviewed Dec 20, 2022

View reviewed changes

leonore reviewed Dec 20, 2022

View reviewed changes

Comment thread ...b/src/enterprise/insights/components/creation-ui/insight-repo-section/InsightRepoSection.tsx Outdated

chwarwick reviewed Dec 20, 2022

View reviewed changes

Comment thread ...b/src/enterprise/insights/components/creation-ui/insight-repo-section/InsightRepoSection.tsx Outdated

vovakulikov force-pushed the vk/new-insight-repo-ui branch from ab927a0 to 52ecbe4 Compare December 20, 2022 19:10

AlicjaSuska reviewed Dec 21, 2022

View reviewed changes

vovakulikov force-pushed the vk/new-insight-repo-ui branch from 30d9a02 to c9d6caa Compare December 21, 2022 15:54

vovakulikov mentioned this pull request Jan 3, 2023

insights: migration to convert all repos insights to a repo search #45964

Closed

vovakulikov force-pushed the vk/new-insight-repo-ui branch from a17bdfa to 4520fac Compare January 3, 2023 19:34

vovakulikov marked this pull request as ready for review January 11, 2023 22:45

vovakulikov changed the title ~~Vk/new insight repo UI~~ Code insights: Add new repositories UI field Jan 11, 2023

vovakulikov requested a review from valerybugakov January 12, 2023 00:14

valerybugakov approved these changes Jan 13, 2023

View reviewed changes

vovakulikov force-pushed the vk/new-insight-repo-ui branch from f9b5943 to 824b7c3 Compare January 13, 2023 16:56

vovakulikov force-pushed the vk/new-insight-repo-ui branch from 9302c29 to b2fcfb0 Compare January 18, 2023 01:47

vovakulikov added 2 commits January 23, 2023 19:46

Split Input.tsx component into small UI component blocks

bbbe30b

Refactor monaco field in order to support codemirror queryState integ…

e657bdf

…ration

vovakulikov and others added 25 commits January 23, 2023 19:46

Add new repo UI to the capture group insight

f0eeac1

Fix potential problems with TS over input types and props

aa21223

Fix insight templates parsers

93fb5db

Fix a few types problem more...

807f92b

Fix parser unit tests

c8c24f0

Add new inputs to the create/update gql handlers

a2442ba

Fix eslint and unit test problems

e4d62b5

Fix integration tests

7851172

Fix disabled/hide value states

c75467e

Fix problems with live preview layout

7fcdfc4

Fix problem with autosuggestion for the repo query field

0025f8c

Fix problems with bad repoquery and repositories values for the creat…

14bec8a

…e mutation

Update client/web/src/enterprise/insights/components/creation-ui/insi…

71f1339

…ght-repo-section/InsightRepoSection.tsx Co-authored-by: chwarwick <christopher.warwick@sourcegraph.com>

Fix copies

6e21d1c

Add async query syntax validation to the repo query field

3f603e1

Add repositories count UI

f6c3423

Fix by UI review comments

d3f351b

insights: adds live preview for strat insights (#45910)

2e75035

Fix imports after main rebasing

3bbf34a

Fix eslint problems with imports order

50b4321

Fix import

3eda023

Fix generated types and run format

6b03bfe

Fix by PR's review comments

f2bc058

Fix after main rebase

dfcb008

Update CHANGELOG.md

52e5333

vovakulikov force-pushed the vk/new-insight-repo-ui branch from b2fcfb0 to 52e5333 Compare January 23, 2023 23:52

vovakulikov added 2 commits January 23, 2023 21:53

Fix integration and init tests

06df4e0

Fix integration test

3437b94

vovakulikov merged commit d318069 into main Jan 24, 2023

vovakulikov deleted the vk/new-insight-repo-ui branch January 24, 2023 01:29

Conversation

vovakulikov commented Dec 15, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Useful links

How to test

Backround

Test plan

App preview:

Uh oh!

sg-e2e-regression-test-bob commented Dec 15, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle size report 📦

Uh oh!

chwarwick commented Dec 20, 2022

Uh oh!

chwarwick commented Dec 20, 2022

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

AlicjaSuska left a comment

Choose a reason for hiding this comment

Uh oh!

valerybugakov left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

valerybugakov Jan 13, 2023

Choose a reason for hiding this comment

Uh oh!

vovakulikov Jan 13, 2023

Choose a reason for hiding this comment

Uh oh!

Uh oh!

valerybugakov Jan 13, 2023

Choose a reason for hiding this comment

Uh oh!

vovakulikov Jan 13, 2023

Choose a reason for hiding this comment

Uh oh!

sourcegraph-bot commented Jan 13, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sourcegraph-bot commented Jan 13, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jan 13, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

vovakulikov commented Dec 15, 2022 •

edited

Loading

sg-e2e-regression-test-bob commented Dec 15, 2022 •

edited

Loading

sourcegraph-bot commented Jan 13, 2023 •

edited

Loading

sourcegraph-bot commented Jan 13, 2023 •

edited

Loading