sourcegraph/client
Felix Kling 1ce2a29ba2
experimental search input: Simplify static extensions initialization (#49225)
**NOTE**: Enable ignore whitespace changes.

This commit cleans up the query input component a little bit by avoiding
re-initializing the static extensions when the component gets
re-rendered. Instead the only extension that depends on some dynamic
value is moved directly into the component.

More importantly though: It avoids recreating the editor styles when
navigating between the search home page and search results/repo pages
(we should avoid that in all other CodeMirror instances too and I have
made the necessary changes locally already, but that will be a separate
PR).

## Test plan

Inspect CodeMirror input on search home page and search results page and
verify that they both have the same CSS class names (i.e. the theme is
not recreated). The `aria-*` attributes are set as well.
2023-03-13 22:34:21 +00:00
..
branded experimental search input: Simplify static extensions initialization (#49225) 2023-03-13 22:34:21 +00:00
browser Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
build-config build: still need BAZEL_BINDIR for webpack_bundle custom rule (#48796) 2023-03-07 20:02:11 -08:00
client-api Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
codeintellify bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
cody Remove cody pnpm-lock to unblock bazel builds (#49192) 2023-03-13 13:21:18 +01:00
common Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
eslint-plugin-wildcard bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
extension-api remove code host native tooltip toggle, hover alerts, command palette, notifs (#48688) 2023-03-06 20:36:18 -08:00
extension-api-types remove code host native tooltip toggle, hover alerts, command palette, notifs (#48688) 2023-03-06 20:36:18 -08:00
http-client bazel: enable type-checking (#48974) 2023-03-08 19:09:52 -08:00
jetbrains Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
observability-client bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
observability-server bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
shared (experimental) search input: Explicitly blur input on repo pages (#49193) 2023-03-13 14:22:02 +01:00
storybook Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
template-parser bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
testing bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
vscode Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
web Support compact mode for the new search box UI (search result and blob pages) (#49173) 2023-03-13 19:03:25 -03:00
web-sveltekit Better import ordering with prettier (#48188) 2023-03-13 08:37:23 +00:00
wildcard rbac: update role management modal UI (#49235) 2023-03-13 14:47:27 -07:00
BUILD.bazel bazel: add bazel build,tests for client/* (#46193) 2023-02-28 20:46:03 -08:00
README.md [SG-46115] - Merge the search-ui package into the branded package (#46197) 2023-01-11 18:27:19 +01:00

Frontend packages

List

  • web: The web application deployed to http://sourcegraph.com/
  • browser: The Sourcegraph browser extension adds tooltips to code on different code hosts.
  • vscode: The Sourcegraph VS Code extension.
  • extension-api: The Sourcegraph extension API types for the Sourcegraph extensions. Published as sourcegraph.
  • extension-api-types: The Sourcegraph extension API types for client applications that embed Sourcegraph extensions and need to communicate with them. Published as @sourcegraph/extension-api-types.
  • sandboxes: All demos-mvp (minimum viable product) for the Sourcegraph web application.
  • shared: Contains common TypeScript/React/SCSS client code shared between the browser extension and the web app. Everything in this package is code-host agnostic.
  • branded: Contains React components and implements the visual design language we use across our web app and e.g. in the options menu of the browser extension. Over time, components from shared and branded packages should be moved into the wildcard package.
  • wildcard: Package that encapsulates storybook configuration and contains our Wildcard design system components. If we're using a component in two or more different areas (e.g. web-app and browser-extension) then it should live in the wildcard package. Otherwise the components should be better colocated with the code where they're actually used.
  • search: Search-related code that may be shared between all clients, both branded (e.g. web, VS Code extension) and unbranded (e.g. browser extension)
  • storybook: Storybook configuration.

Further migration plan

  1. Fix circular dependency in TS project-references graph wildcard package should not rely on web and probably shared, branded too. Ideally it should be an independent self-contained package.

  2. Decide on package naming and update existing package names. Especially it should be done for a shared package because we have multiple shared folders inside of other packages. It's hard to understand from where dependency is coming from and it's not possible to refactor import paths using find-and-replace.

  3. Investigate if we can painlessly switch to npm workspaces.

  4. Content of packages shared and branded should be moved to wildcard and refactored using the latest FE rules and conventions. Having different packages clearly communicates the migration plan. Developers first should look for components in the wildcard package and then fall-back to legacy packages if wildcard doesn't have the solution to their problem yet.

  5. shared contains utility functions, types, polyfills, etc which is not a part of the Wildcard component library. These modules should be moved into utils package and other new packages: e.g. api for GraphQL client and type generators, etc.

  6. Packages should use package name (e.g. @sourcegraph/wildcard) for imports instead of the relative paths (e.g. ../../../../wildcard/src/components/Markdown) to avoid long relative-paths and make dependency graph between packages clear. (Typescript will warn if packages have circular dependencies). It's easy to refactor such isolated packages, extract functionality into new ones, or even into new repositories.

  7. build or config package should be added later to encapsulate all the configurations reused between packages which will allow removing jest.config, babel.config from the root of the repo.