Merge branch 'update-docs' of github.com:weaveworks/weave-gitops into update-docs

Author: AlinaGoaga

.eslintrc

@@ -6,11 +6,23 @@
         "plugin:@typescript-eslint/recommended",
         "plugin:import/typescript"
     ],
+    "plugins": [
+        "@typescript-eslint",
+        "import"
+    ],
     "rules": {
         "import/default": 0,
         "import/no-named-as-default-member": 0,
         "import/named": 2,
-        "import/order": 2,
+        "import/order": [
+            2,
+            {
+                "alphabetize": {
+                    "order": "asc",
+                    "caseInsensitive": true
+                }
+            }
+        ],
         "@typescript-eslint/explicit-module-boundary-types": 0,
         "@typescript-eslint/no-explicit-any": 0,
         "@typescript-eslint/ban-ts-comment": 0,
@@ -20,5 +32,5 @@
     "ignorePatterns": "rpc",
     "parserOptions": {
         "project": "./tsconfig.json"
-     }
+    }
 }

README.md

@@ -6,43 +6,55 @@
 [![Release](https://img.shields.io/github/v/release/weaveworks/weave-gitops?include_prereleases)](https://github.com/weaveworks/weave-gitops/releases/latest)
 [![FOSSA Status](https://app.fossa.com/api/projects/custom%2B19155%2Fgithub.com%2Fweaveworks%2Fweave-gitops.svg?type=shield)](https://app.fossa.com/reports/005da7c4-1f10-4889-9432-8b97c2084e41)
 
-Weave GitOps is a simple open source developer platform for people who want cloud native applications, without needing
-Kubernetes expertise. Experience how easy it is to enable GitOps and run your apps in a cluster. Use git to collaborate
+Weave GitOps is a simple, open source developer platform for people who want cloud native applications but who don't have
+Kubernetes expertise. Experience how easy it is to enable GitOps and run your apps in a cluster. Use Git to collaborate
 with team members making new deployments easy and secure. Start with what developers need to run apps, and then easily
 extend to define and run your own enterprise platform.
 
 From Kubernetes run Weave GitOps to get:
 
 1. Application Operations: manage and automate deployment pipelines for apps and more
 2. Platforms: the easy way to have your own custom PaaS on cloud or on premise
-3. Extensions: coordinate Kubernetes rollouts with eg. VMs, DBs and cloud services
+3. Extensions: coordinate Kubernetes rollouts with eg. VMs, databases, and cloud services
 
-Our vision is that all cloud native applications should be easy for developers, including operations which should be
+Our vision is that all cloud native applications should be easy for developers, and that operations should be
 automated and secure. Weave GitOps is a highly extensible tool to achieve this by placing Kubernetes and GitOps at the
 core and building a platform around that.
 
-We use GitOps tools throughout. Today Weave GitOps defaults are Flux, Kustomize, Helm, Sops and Kubernetes CAPI. If you
-use Flux already then you can easily add Weave GitOps to create a platform management overlay.
+Weave GitOps defaults are [Flux](https://fluxcd.io/flux/) as the GitOps engine, Kustomize, Helm, Sops, and Kubernetes CAPI. If you use Flux already, then you can easily add Weave GitOps to create a platform management overlay.
+
+Weave GitOps Open Source provides:
+
+- Continuous Delivery through GitOps for apps and infrastructure.
+- Support for GitHub, GitLab, and Bitbucket; S3-compatible buckets as a source; all major container registries; and all CI workflow providers.
+- A secure, pull-based mechanism, operating with least amount of privileges, and adhering to Kubernetes security policies.
+- Compatibility with any conformant Kubernetes version and common ecosystem technologies such as Helm, Kustomize, RBAC, Prometheus, OPA, Kyverno, etc.
+- Multitenancy, multiple Git repositories, multiple clusters.
+- Alerts and notifications.
 
 ### Manage and view applications all in one place.
 
 ![Application Page](./doc/img/01-workloads.png)
 
-### Easily see your continuous deployments and what is being produced via GitOps. There are multiple views for debugging as well as being able to sync your latest git commits directly from the UI.
+### Easily see your continuous deployments and what is being produced via GitOps. There are multiple views for debugging as well as being able to sync your latest Git commits directly from the UI.
 
 ![Reconciliation Page](./doc/img/02-workload-detail.png)
 
-### Leverage Kubernetes RBAC to control permissions in the dashboard.
+### Check out the Graph view.
+
+![Graph View](./doc/img/03-graph.png)
+
+### Review the yaml file.
 
-![Source Page](./doc/img/03-rbac.jpg)
+![Yaml View](./doc/img/04-yaml.png)
 
 ### See your entire source landscape whether it is a git repository, helm repository, or bucket.
 
-![Flux Runtime](./doc/img/04-sources.jpg)
+![Sources view](./doc/img/05-sources.png)
 
 ### Quickly see the health of your reconciliation deployment runtime. These are the workers that are ensuring your software is running on the Kubernetes cluster.
 
-![Flux Runtime](./doc/img/05-runtime.jpg)
+![Flux Runtime](./doc/img/06-runtime.png)
 
 ## Getting Started
 

doc/img/01-workloads.png

@@ -100,10 +100,10 @@
     "@types/react-dom": "^17.0.5",
     "@types/react-router-dom": "^5.1.6",
     "@types/styled-components": "^5.1.9",
-    "@typescript-eslint/eslint-plugin": "^4.33.0",
-    "@typescript-eslint/parser": "^4.33.0",
+    "@typescript-eslint/eslint-plugin": "^6.6.0",
+    "@typescript-eslint/parser": "^6.6.0",
     "buffer": "^5.7.1",
-    "eslint": "^7.28.0",
+    "eslint": "^8.48.0",
     "eslint-plugin-import": "^2.25.4",
     "jest": "^27.3.1",
     "jest-styled-components": "^7.0.4",
@@ -112,7 +112,7 @@
     "process": "^0.11.10",
     "react-test-renderer": "^17.0.2",
     "ts-jest": "^27.1.1",
-    "typescript": "4.9.3",
+    "typescript": "^5.2.2",
     "yarn-audit-fix": "^10.0.1"
   },
   "alias": {

doc/img/02-workload-detail.png

@@ -13,6 +13,7 @@ import * as React from "react";
 import { useHistory, useLocation } from "react-router-dom";
 import styled from "styled-components";
 import { ThemeTypes } from "../../contexts/AppContext";
+import { SearchedNamespaces } from "../../lib/types";
 import { IconButton } from "../Button";
 import CheckboxActions from "../CheckboxActions";
 import ChipGroup from "../ChipGroup";
@@ -23,12 +24,10 @@ import FilterDialog, {
 } from "../FilterDialog";
 import Flex from "../Flex";
 import Icon, { IconType } from "../Icon";
+import InfoModal from "../InfoModal";
 import SearchField from "../SearchField";
 import Spacer from "../Spacer";
 import Text from "../Text";
-import InfoModal from "../InfoModal";
-import { SearchedNamespaces } from "../../lib/types";
-import SortableLabel from "./SortableLabel";
 import {
   filterRows,
   filterSelectionsToQueryString,
@@ -38,6 +37,7 @@ import {
   sortByField,
   toPairs,
 } from "./helpers";
+import SortableLabel from "./SortableLabel";
 import { Field, FilterState } from "./types";
 
 /** DataTable Properties  */

doc/img/03-graph.png

@@ -14,9 +14,9 @@ import LogoutIcon from "@material-ui/icons/ExitToApp";
 import FileCopyIcon from "@material-ui/icons/FileCopyOutlined";
 import FilterIcon from "@material-ui/icons/FilterList";
 import HourglassFullIcon from "@material-ui/icons/HourglassFull";
+import InfoIcon from "@material-ui/icons/Info";
 import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
 import KeyboardArrowRightIcon from "@material-ui/icons/KeyboardArrowRight";
-import InfoIcon from "@material-ui/icons/Info";
 import LaunchIcon from "@material-ui/icons/Launch";
 import NavigateBeforeIcon from "@material-ui/icons/NavigateBefore";
 import NavigateNextIcon from "@material-ui/icons/NavigateNext";

doc/img/03-rbac.jpg

@@ -12,8 +12,8 @@ import DataTable, {
 } from "./DataTable";
 import Flex from "./Flex";
 import KubeStatusIndicator from "./KubeStatusIndicator";
-import MessageBox from "./MessageBox";
 import Link from "./Link";
+import MessageBox from "./MessageBox";
 import Spacer from "./Spacer";
 import Text from "./Text";
 

doc/img/04-sources.jpg

@@ -1,14 +1,14 @@
 import React, { FC } from "react";
 import { useFeatureFlags } from "../../../hooks/featureflags";
+import { PolicyObj as Policy } from "../../../lib/api/core/core.pb";
 import { formatURL } from "../../../lib/nav";
 import { V2Routes } from "../../../lib/types";
 import DataTable, { filterConfig } from "../../DataTable";
 import Link from "../../Link";
 import Text from "../../Text";
+import Timestamp from "../../Timestamp";
 import PolicyMode from "../Utils/PolicyMode";
 import Severity from "../Utils/Severity";
-import { PolicyObj as Policy } from "../../../lib/api/core/core.pb";
-import Timestamp from "../../Timestamp";
 
 interface CustomPolicy extends Policy {
   audit?: string;

doc/img/04-yaml.png

@@ -1,18 +1,18 @@
 import React from "react";
 import remarkGfm from "remark-gfm";
-import { PolicyValidation } from "../../../lib/api/core/core.pb";
-import Flex from "../../Flex";
-import Text from "../../Text";
-import Timestamp from "../../Timestamp";
 
 import { AppContext } from "../../../contexts/AppContext";
 import { useFeatureFlags } from "../../../hooks/featureflags";
+import { PolicyValidation } from "../../../lib/api/core/core.pb";
 import { Kind } from "../../../lib/api/core/types.pb";
 import { formatURL } from "../../../lib/nav";
 import { FluxObject } from "../../../lib/objects";
 import { V2Routes } from "../../../lib/types";
 import ClusterDashboardLink from "../../ClusterDashboardLink";
+import Flex from "../../Flex";
 import Link from "../../Link";
+import Text from "../../Text";
+import Timestamp from "../../Timestamp";
 import HeaderRows, { RowItem } from "../Utils/HeaderRows";
 import { MarkdownEditor } from "../Utils/MarkdownEditor";
 import Parameters from "../Utils/Parameters";

doc/img/05-runtime.jpg

@@ -2,13 +2,13 @@ import React from "react";
 
 import styled from "styled-components";
 import { useGetPolicyValidationDetails } from "../../../hooks/policyViolations";
+import { PolicyValidation } from "../../../lib/api/core/core.pb";
 import { Kind } from "../../../lib/api/core/types.pb";
 import { formatURL } from "../../../lib/nav";
+import { FluxObject } from "../../../lib/objects";
 import { V2Routes } from "../../../lib/types";
 import Page from "../../Page";
 
-import { PolicyValidation } from "../../../lib/api/core/core.pb";
-import { FluxObject } from "../../../lib/objects";
 import { ViolationDetails } from "./PolicyViolationDetails";
 
 const getPath = (kind: string, violation?: PolicyValidation) => {

doc/img/05-sources.png

@@ -1,16 +1,16 @@
 import React from "react";
+import { useFeatureFlags } from "../../../../hooks/featureflags";
 import { useListPolicyValidations } from "../../../../hooks/policyViolations";
 import { ListPolicyValidationsRequest } from "../../../../lib/api/core/core.pb";
+import { Kind } from "../../../../lib/api/core/types.pb";
 import { formatURL } from "../../../../lib/nav";
 import { V2Routes } from "../../../../lib/types";
 import DataTable, { Field, filterConfig } from "../../../DataTable";
 import Link from "../../../Link";
 import RequestStateHandler from "../../../RequestStateHandler";
+import Text from "../../../Text";
 import Timestamp from "../../../Timestamp";
 import Severity from "../../Utils/Severity";
-import { useFeatureFlags } from "../../../../hooks/featureflags";
-import { Kind } from "../../../../lib/api/core/types.pb";
-import Text from "../../../Text";
 
 interface Props {
   req: ListPolicyValidationsRequest;

doc/img/06-runtime.png

@@ -1,7 +1,7 @@
 import { render } from "@testing-library/react";
 import React from "react";
-import Severity from "../Utils/Severity";
 import { withTheme } from "../../../lib/test-utils";
+import Severity from "../Utils/Severity";
 
 function checkSeverity(severity: string) {
   render(withTheme(<Severity severity={severity} />));

package.json

@@ -1,6 +1,6 @@
+import { render } from "@testing-library/react";
 import React from "react";
 import { MemoryRouter } from "react-router-dom";
-import { render } from "@testing-library/react";
 import { withTheme } from "../../lib/test-utils";
 import Link from "../Link";
 

ui/components/DataTable/DataTable.tsx

@@ -2,8 +2,8 @@ import qs from "query-string";
 import * as React from "react";
 import { useQuery } from "react-query";
 import { Core, GetFeatureFlagsResponse } from "../lib/api/core/core.pb";
-import { RequestError } from "../lib/types";
 import { TokenRefreshWrapper } from "../lib/requests";
+import { RequestError } from "../lib/types";
 import { AuthRoutes } from "./AuthContext";
 
 type Props = {

ui/components/Icon.tsx

@@ -2,13 +2,13 @@ import { useContext } from "react";
 import { useQuery } from "react-query";
 
 import { CoreClientContext } from "../contexts/CoreClientContext";
-import { ReactQueryOptions, RequestError } from "../lib/types";
 import {
   ListPoliciesRequest,
   ListPoliciesResponse,
   GetPolicyRequest,
   GetPolicyResponse,
 } from "../lib/api/core/core.pb";
+import { ReactQueryOptions, RequestError } from "../lib/types";
 
 const LIST_POLICIES_QUERY_KEY = "list-policy";
 

ui/components/NotificationsTable.tsx

@@ -2,13 +2,13 @@ import { useContext } from "react";
 import { useQuery } from "react-query";
 
 import { CoreClientContext } from "../contexts/CoreClientContext";
-import { ReactQueryOptions, RequestError } from "../lib/types";
 import {
   GetPolicyValidationRequest,
   GetPolicyValidationResponse,
   ListPolicyValidationsRequest,
   ListPolicyValidationsResponse,
 } from "../lib/api/core/core.pb";
+import { ReactQueryOptions, RequestError } from "../lib/types";
 
 const LIST_POLICY_VIOLATION_QUERY_KEY = "list-policy-violations";
 

ui/components/Policies/PolicyList/PolicyTable.tsx

@@ -1,9 +1,9 @@
 import _ from "lodash";
+import { pod, rs } from "../__fixtures__/graph";
 import { Core, GetChildObjectsResponse } from "../api/core/core.pb";
 import { Kind } from "../api/core/types.pb";
 import { getChildren } from "../graph";
 import { createCoreMockClient } from "../test-utils";
-import { pod, rs } from "../__fixtures__/graph";
 
 describe("graph lib", () => {
   let client: typeof Core;

ui/components/Policies/PolicyViolations/PolicyViolationDetails.tsx

@@ -1,5 +1,5 @@
-import { Kind } from "../api/core/types.pb";
 import { pod, rs } from "../__fixtures__/graph";
+import { Kind } from "../api/core/types.pb";
 import {
   Bucket,
   FluxObject,

ui/components/Policies/PolicyViolations/PolicyViolationPage.tsx

@@ -8,8 +8,8 @@ import {
   Interval,
   Kind,
   NamespacedObjectReference,
-  Object as ResponseObject,
   ObjectRef,
+  Object as ResponseObject,
 } from "./api/core/types.pb";
 export type Automation = HelmRelease | Kustomization;
 export type Source =
@@ -342,7 +342,7 @@ export class ImagePolicy extends ImageUpdateAutomation {
     super(response);
   }
   get imagePolicy(): ImgPolicy {
-    const { policy } = this.obj?.spec;
+    const { policy } = this.obj?.spec || {};
     const [type] = Object.keys(policy);
     if (type) {
       const [val] = Object.values(policy[type]);

ui/components/Policies/PolicyViolations/Table/index.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import styled from "styled-components";
-import Content from "../components/Page";
 import Flex from "../components/Flex";
+import Content from "../components/Page";
 
 type Props = {
   className?: string;

ui/components/Policies/__tests__/Severity.test.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
-import { Auth } from "../../contexts/AuthContext";
 import Page from "../../components/Page";
 import UserGroupsTable from "../../components/UserGroupsTable";
+import { Auth } from "../../contexts/AuthContext";
 type Props = {
   className?: string;
 };

ui/components/__tests__/Link.test.tsx

@@ -11,7 +11,7 @@ import BrowserOnly from "@docusaurus/BrowserOnly";
 
 ## Creating your first CAPD Cluster
 
-If you've followed the [Installation guide](installation/weave-gitops-enterprise/index.mdx) you should have:
+If you've followed the [Installation guide](../enterprise/getting-started/install-enterprise.mdx) you should have:
 
 1. Weave GitOps Enterprise installed
 2. A CAPI provider installed (With support for `ClusterResourceSet`s enabled).

ui/contexts/CoreClientContext.tsx

@@ -1,7 +1,6 @@
 ---
 title: AWS Marketplace
 hide_title: true
-pagination_next: getting-started/ui
 ---
 
 import Tabs from "@theme/Tabs";
@@ -200,7 +199,3 @@ flux-system          ww-gitops-weave-gitops-5bdc9f7744-vkh65             1/1
 ```
 
 Your Weave GitOps installation is now ready!
-
-## Next steps
-
-In our following [Get Started document](../getting-started/ui.mdx), we will walk you through logging into the GitOps Dashboard and deploying an application.

ui/hooks/Policies.ts

@@ -2,10 +2,9 @@
 title: Airgap Environments
 hide_title: true
 toc_max_heading_level: 4
-pagination_next: getting-started/ui
 ---
 
-import TierLabel from "../../_components/TierLabel";
+import TierLabel from "@site/docs/_components/TierLabel";
 
 # Install in Airgap Environments <TierLabel tiers="Enterprise" />