Imports lodash function individually, eliminate 'import _ from lodash'
This branch replaces imports of all of lodash (import _ from 'lodash' with per
function imports e..g import _isNil from 'lodash/isNil'. This reduces the bundle
size from~520 kb to ~160kb.
I've also taken the opportunity to replace our use of lodash functions with
native js functions where it makes sense (e.g. some maps, concats, sizes).
- Adds bundle analyzer so we can see the composition of our bundle.
- Stop importing all the locales of moment.js
- Use named imports for all places we use material-ui components
- Fix a bug where, due to the controller components being relabled
linkerd-, the service mesh page wasn't showing the correct statuses.
- Fixes some eslint warnings on tests
A container called `proxy-api` runs in the Linkerd2 controller pod. This container listens on port 8086 and serves the proxy-api but does nothing other than forward gRPC requests to the destination container which listens on port 8089.
We remove the proxy-api container altogether and change the destination container to listen on port 8086 instead of 8089. The result is that clients still use the proxy-api by connecting to `proxy-api.<ns>.svc.cluster.local:8086` but the controller has one fewer containers. This results in a simpler system that is easier to reason about.
Signed-off-by: Alex Leong <alex@buoyant.io>
* Re-add sortable column headers to tables in web UI
* Display sort icons on all sortable columns
* Disable src/dst popover in top table
Signed-off-by: Kevin Lingerfelt <kl@buoyant.io>
Try to standardize theming and colours throughout the app:
- Move Material UI theme definition into its own file
- Use theme colours in success rate charts
- Remove all colour definitions from styles.css
- Remove unused styles in styles.css
- Audit bare h tag usage throughout the app; replace with Typography
- Standardize the colours to the theme for Progress.jsx
- Use theme colour in Spinner
- Default to warning in meshed status table bar chart
Switch the dashboard's component library from antd to material-ui.
There are extensive changes to most of the frontend components in the app.
This branch changes all uses of antd components to their closest equivalent in
material. There is still a lot of polish that needs to go into the look of
individual components, but since the major component rewrites are done, I think
get this work in so that further work can be done in smaller branches.
Changes in this branch:
- add Material-UI 3.2.2 to the project
- replace all uses of antd with material-ui components
- remove antd from the project
- slight modifications of eslint rules
- restructuring of app components to be rendered under the Navigation
component
- deleted most of our css (replaced with material's inline styles)
- pinned package versions in package.json (mostly removing ^)
This PR adds a breadcrumb style navigation to the Linkerd dashboard. Each "crumb" links to its corresponding page in the UI.
This PR also includes a small UI fix in the sidebar. The select box always seems to revert to the All Namespaces option whenever there is a state change on the React side. The fix ensures that the select box always displays the namespace filter if it is available and revert to All Namespaces when no namespace is selected.
fixes#1464fixes#1543fixes#1627
Signed-off-by: Dennis Adjei-Baah <dennis@buoyant.io>
Previously, WebSocket error messages would appear with the first
couple characters cut off. I've fixed this by using ws.WriteControl
instead of ws.WriteMessage to write errors, as gorilla does in
their example app.
- Use writeControl to write error messages to the client
- Stop the spinner if there is an error present
* Changing the statusText to be an object with more fields, then displaying them in the ErrorBanner
Signed-off-by: Adam Christian <adam@buoyant.io>
Refactoring karma tests and propTypes and defaultProps per the code review from @rmars
Signed-off-by: Adam Christian <adam@buoyant.io>
Changing the default message to pass the ServiceMeshTest ErrorBanner assertion
Revert "Changing the default message to pass the ServiceMeshTest ErrorBanner assertion"
This reverts commit 2415b7099b03ad7a8deda9f67218bb531111b3ec.
Fixing the failing karma unit tests because the statusMessage wasn't being properly passed into the component rendering stub context
Signed-off-by: Adam Christian <adam@buoyant.io>
merging master in
Signed-off-by: Adam Christian <adam@buoyant.io>
* Export api error type independently from ApiHelpers
Signed-off-by: Adam Christian <adam@buoyant.io>
This PR adjusts the colour of a popup in the sidebar, as well as removes
references to conduit in the frontend test fixtures.
All that's left in the Web UI code now is a few references to the conduit sites / githubs,
as well as the CLI name.
* Remove a touch of conduit blue from the sidebar popup
* Remove minor references to conduit throughout the web code
* Fully colour the sidebar in new bg colour
This PR starts removing all references to the word "Conduit" in the web UI.
In the interest of not making huge changes all at once, I'll gradually start moving away
from the usage of "conduit" in the Web UI. For example, there are a lot of components that
have conduit in their names but they don't need to.
This branch is mostly component / variable names. There should be no visible changes except
the spinner is no longer a Conduit spinner.
See #1262 for visible branding changes.
- Rename ConduitLink to PrefixedLink
- Remove ConduitSpinner in favour of antd.Spin
- Remove css classnames that are conduit- centered
- Parameterize the current Product Name so that it's easier to change in the future
Tracking ticket: linkerd/linkerd#2018
- Add Reason to the error data passed from the api
- Rewrite error logic in the UI to try to make it clearer
- Show 0/0 pods meshed instead of 0/0 pods meshed (N/A) if 0 pods are meshed
- Return pod uptimes from the GetPods endpoint
- Adds filtering by namespace to api.GetPods
- Adds a --namespace filter to conduit get pods
- Adds pod uptimes to the controller component toolitps on the ServiceMesh page
- Moves the ServiceMesh page back to using /api/pods
* Display proxy container errors in the Web UI
Add an error modal to display pod errors
Add icon to data tables to indicate errors are present
Display errors on the Service Mesh Overview Page and all the resource pages
* Add propType validation
When refactoring components, it is hard to know what is required and isn't.
Adds propTypes to the existing components and enables eslint errors for anything
moving forward. This should keep us documenting the API for components.
* Remove extra newline
Previously, we would filter out stats coming from Conduit itself and from the kube-*
namespaces on some views in the Web UI. Remove this filtering, so that we display
all the resource information we get back from the Stat API. (Fixes#997)
On the Resource pages, the call to action would show up when there were no
metrics present, but that's actually not actionable by the user. Instead, I'm
going to show a blank table with a "no s detected" message.
* Remove special-case filtering out of kube-* namespaces, and conduit namespaces
* Remove the call to action for no metrics
* Linkify the namespace column for the resource pages
* Add an app-wide context for global props.
We've been passing the `api` object down from the top of the react tree. With
16.x, there's now the ability to have context that can inject anywhere in the
tree. This creates a top level context provider that contains most of the global
variables we've been using (api, appData, ...). It subsequently cleans up some
of the routes and nested components.
- Bumps `react-dom` to 16.3.2 (to match `react`).
- Adds `enzyme-context-patch` for now. This is fixed in enzyme master, but there
has not been a release yet. Needs to be removed when that is fixed.
* Use a default inside appData for controllerNamespace
* Update syntax of if to use curly brackets
This PR modifies the Namespace page in the web UI to replace the 3 existing api calls
with a single call.
* Consolidate calls to /metrics to use the new resource type all
* Simplify urlsForResource, add comment with assumptions
* Turn the status bars red if there exist failed pods in the namespace
* Also use failed pods in conduit component table
Now that the API returns the number of failed pods, use this info to indicate failed pods in
the ServiceMesh page.
The bars will turn red if there are any failed pods present in the namespace.
They'll be green if they have non-zero pods meshed, and grey otherwise.
Add namespaces as a top level resource in the Web UI
This PR does the following:
- Replace the deployments table in the service mesh page with namespaces
- Add a Namespaces index page that lists all namespaces and their stats
- Add an individual namespace page showing all resources for that namespace
- Make the incomplete mesh message more generic to any resource type
- Revamp rest of service mesh page to move off ListPods
* Remove the telemetry service
The telemetry service is no longer needed, now that prometheus scrapes
metrics directly from proxies, and the public-api talks directly to
prometheus. In this branch I'm removing the service itself as well as
all of the telemetry protobuf, and updating the conduit install command
to no longer install the service. I'm also removing the old version of
the stat command, which required the telemetry service, and renaming the
statsummary command to stat.
* Fix time window tests
* Remove deprecated controller scrape config
Signed-off-by: Kevin Lingerfelt <kl@buoyant.io>
* Link to Grafana from Conduit Dashboard
Previously the only way to access the Grafana dashboards was via direct
link, provided by the `conduit dashboard` command.
Add Grafana links throughout the Conduit Dashboard, next to all
Deployment objects. This change also modifies the behavior of the
ConduitLink helper, to enable linking to other deployments proxied by
the `conduit dashboard` command.
Part of #420
Signed-off-by: Andrew Seigner <siggy@buoyant.io>
* review feedback
Signed-off-by: Andrew Seigner <siggy@buoyant.io>
* review feedback, fix console, remove absolute
Signed-off-by: Andrew Seigner <siggy@buoyant.io>
* fix pod status and count display in control plane dashboard section:
- the control plane would show terminated and stale deployments in the UI, this is confusing and might indicate errors
- this filters out temrinated and failed component deploys from the UI
- it is to note that pending deploys will still be counted and represented with a greyed out status dot
- Fixes: #606
Signed-off-by: Franziska von der Goltz <franziska@vdgoltz.eu>
Signed-off-by: Franziska von der Goltz <franziska@vdgoltz.eu>
* Display more decimal points for truncated numbers, add hover info
* Filter completed pods out of web UI
* Decrease the polling interval from 10s to 2s
* Add more detailed pod categorization based on status
* Tweak filtering of pods, tweak explanations in status table
- reduce row spacing on tables to make them more compact
- Rename TabbedMetricsTable to MetricsTable since it's not tabbed any more
- Format latencies greater than 1000ms as seconds
- Make sidebar collapsible
- poll the /pods endpoint from the sidebar in order to refresh the list of deployments in the autocomplete
- display the conduit namespace in the service mesh details table
- Use floats rather than Col for more responsive layout (fixes#224)
UI cleanups. Remove repetitive labels in the UI, remove unused elements,
remove graphs until we improve their utility.
- remove “Deployment” from the headers of the Deployment Detail Page
- remove Routes in sidebar
- kill leftmost 100px of sidebear
- remove word controller from service mesh page first table
- add twitter and GitHub and slack links
- kill the graphs, replace with one large header (request rate, success rate, latency top bar)
put upstream/downstream diagram before upstream downstream tables
* Clean up DeploymentList page (#321)
- remove "Most active deployments" graphs from the Deployments List page
- remove the scatterplot sections of the page as I don't think we'll be using them for a while
* Control metricsWindow from root of app
- Add buttons [currently hidden] on metrics pages to control window of metrics requests
- Consolidate metricsWindow usage (stop passing it around)
- Add a ConduitLink component so we can stop passing around pathPrefix
- Add tests for ApiHelpers
* Hide the time window buttons; fix bug in absolute links
* Add a note explaining why metricWindow buttons are disabled
* Convert ConduitLink in to a component that wraps another
* Various small UI naming tweaks
- align top two tables in the service mesh page
- "All Deployments" -> "Deployments"
- reorder latency p50, p95, p99
- "Current success" -> "Success rate"
* Add margin to incomplete mesh message, reorder latency in TabbedMetricsTable
* Right align numbers in service mesh page
* Add autocomplete search bar back into sidebar
Signed-off-by: Risha Mars <mars@buoyant.io>
* Use getPodsByDeployment
Signed-off-by: Risha Mars <mars@buoyant.io>
* Have better empty states in Deployment Detail and Pod Detail
* Fix call to action on deployment detail page
Adds various checks to hide sections of pages that don't have data:
* Removes the timeseries graphs and latency overview from Deployment/Pod
detail if there are no metrics for it
* Removes the Upstreams/Downstreams if num upstreams / downstreams is 0
* Removes the pod barcharts from the Deployment detail if there are no pods
* If there are no pod metrics, populate the list of pods from /pods
These changes strip the pod detail view down a lot if there's no pod data, but that might be fine
* fix inconsistent deployment count on servicemesh page.
* tests added for deploy count messaging on servicemesh page
* refactored code for Call To Action component to use 'instructions' in util
* refactored correlating css
* fix sidebar highlighting when dashboard is opened via cli:
- took path prefix into account
* addressed review feedback: using pathprefix
* addressed review feedback:
- revert to using this.props.location
* updates sidebar, initial progress indicator
* Update web README
* Revamp metrics processing in MetricUtils
- Try to improve documentation of functions
- Remove nested data from processed metrics - they were often duplicated data
- Split out timeseries processing from rollup processing
- Remove the 'rollup' level of nesting
- Limit the number of timeseries we fetch on the deployments page
We’ve built Conduit from the ground up to be the fastest, lightest,
simplest, and most secure service mesh in the world. It features an
incredibly fast and safe data plane written in Rust, a simple yet
powerful control plane written in Go, and a design that’s focused on
performance, security, and usability. Most importantly, Conduit
incorporates the many lessons we’ve learned from over 18 months of
production service mesh experience with Linkerd.
This repository contains a few tightly-related components:
- `proxy` -- an HTTP/2 proxy written in Rust;
- `controller` -- a control plane written in Go with gRPC;
- `web` -- a UI written in React, served by Go.
Risha Mars
Alex Leong
Kevin Lingerfelt
Dennis Adjei-Baah
Adam Christian
Thomas Rampelberg
Andrew Seigner
Franziska von der Goltz
Dennis Adjei-Baah
Sterling White
Oliver Gould