diff --git a/elixir/apps/web/lib/web/live/settings/dns.ex b/elixir/apps/web/lib/web/live/settings/dns.ex index bc6022f4b..0fea60f9e 100644 --- a/elixir/apps/web/lib/web/live/settings/dns.ex +++ b/elixir/apps/web/lib/web/live/settings/dns.ex @@ -31,18 +31,19 @@ defmodule Web.Settings.DNS do <:content>

- Configure the default resolver used by connected Clients in your Firezone network. Queries for + Configure the default resolver used by connected Clients in your Firezone account. Queries for defined Resources will always use Firezone's internal DNS. All other queries will - use the resolver configured below. + use the resolver below if configured. If no resolver is configured, the client's default system + resolver will be used.

<.link class="text-blue-600 hover:underline" - href="https://www.firezone.dev/docs/architecture/dns" + href="https://www.firezone.dev/kb/administer/dns?utm_source=product" target="_blank" > - Read more about how DNS works in Firezone. + Read more about configuring DNS in Firezone. <.icon name="hero-arrow-top-right-on-square" class="-ml-1 mb-3 w-3 h-3" />

diff --git a/elixir/apps/web/lib/web/live/settings/identity_providers/index.ex b/elixir/apps/web/lib/web/live/settings/identity_providers/index.ex index 48132a189..04ccbfd61 100644 --- a/elixir/apps/web/lib/web/live/settings/identity_providers/index.ex +++ b/elixir/apps/web/lib/web/live/settings/identity_providers/index.ex @@ -44,10 +44,10 @@ defmodule Web.Settings.IdentityProviders.Index do

<.link class="text-blue-600 hover:underline" - href="https://www.firezone.dev/docs/architecture/sso" + href="https://www.firezone.dev/kb/authenticate?utm_source=product" target="_blank" > - Read more about how SSO works in Firezone. + Read more about setting up SSO in Firezone. <.icon name="hero-arrow-top-right-on-square" class="-ml-1 mb-3 w-3 h-3" />

diff --git a/elixir/apps/web/lib/web/live/settings/identity_providers/saml/components.ex b/elixir/apps/web/lib/web/live/settings/identity_providers/saml/components.ex index 06e5b4bdc..c83fe45a5 100644 --- a/elixir/apps/web/lib/web/live/settings/identity_providers/saml/components.ex +++ b/elixir/apps/web/lib/web/live/settings/identity_providers/saml/components.ex @@ -114,7 +114,7 @@ defmodule Web.Settings.IdentityProviders.SAML.Components do

<.link class="text-blue-600 hover:underline" - href="https://www.firezone.dev/docs/authenticate/jit-provisioning#extract-group-membership-information" + href="https://www.firezone.dev/kb/authenticate/user-group-sync?utm_source=product" target="_blank" > Read more about group extraction. diff --git a/elixir/apps/web/lib/web/live/sign_in.ex b/elixir/apps/web/lib/web/live/sign_in.ex index b6931ffb4..cbed1d67f 100644 --- a/elixir/apps/web/lib/web/live/sign_in.ex +++ b/elixir/apps/web/lib/web/live/sign_in.ex @@ -101,8 +101,11 @@ defmodule Web.SignIn do

- <%= # TODO: Add link to client instructions docs %> Meant to sign in from a client instead? - + Meant to sign in from a client instead? + Read the docs.

diff --git a/elixir/apps/web/test/web/live/sign_in/email_test.exs b/elixir/apps/web/test/web/live/sign_in/email_test.exs index 77f7c108a..c10614b0b 100644 --- a/elixir/apps/web/test/web/live/sign_in/email_test.exs +++ b/elixir/apps/web/test/web/live/sign_in/email_test.exs @@ -138,7 +138,7 @@ defmodule Web.SignIn.EmailTest do assert conn.assigns.flash["error"] == "The sign in token is invalid or expired." end - test "allows to resend magic link", %{ + test "allows resending sign in link", %{ account: account, provider: provider, identity: identity, diff --git a/website/public/images/user-group-sync.svg b/website/public/images/user-group-sync.svg index cb3e22ec1..8e7ca533e 100644 --- a/website/public/images/user-group-sync.svg +++ b/website/public/images/user-group-sync.svg @@ -1,4 +1,4 @@ - + diff --git a/website/src/app/blog/firezone-1-0/readme.mdx b/website/src/app/blog/firezone-1-0/readme.mdx index e0397ce7c..36108f6e1 100644 --- a/website/src/app/blog/firezone-1-0/readme.mdx +++ b/website/src/app/blog/firezone-1-0/readme.mdx @@ -226,7 +226,7 @@ goes one step further by exposing granular controls to allow or deny access based on attributes like which group a user is a member of and so on. Of course if you wanted to use Firezone 1.0 like a traditional perimeter-based -VPN and then transition to finer-grined access controls over time, you can do +VPN and then transition to finer-grained access controls over time, you can do that as well. We understand the realities of legacy processes and systems, so we designed 1.0 to be flexible enough to suit the needs of both. diff --git a/website/src/app/docs/administer/troubleshoot/readme.mdx b/website/src/app/docs/administer/troubleshoot/readme.mdx index 0e874dfeb..a2ac62aa9 100644 --- a/website/src/app/docs/administer/troubleshoot/readme.mdx +++ b/website/src/app/docs/administer/troubleshoot/readme.mdx @@ -81,6 +81,12 @@ and configured automatically. In most cases, you'll find clues in one or more of the following locations: + + +- `firezone` service logs: `docker compose logs firezone` +- `caddy` service logs: `docker compose logs caddy` + + - Your browser's developer tool logs, specifically the `Network` tab. diff --git a/website/src/app/docs/authenticate/oidc/readme.mdx b/website/src/app/docs/authenticate/oidc/readme.mdx index 10a550686..f9edd6ea4 100644 --- a/website/src/app/docs/authenticate/oidc/readme.mdx +++ b/website/src/app/docs/authenticate/oidc/readme.mdx @@ -7,7 +7,7 @@ Firezone supports Single Sign-On (SSO) via OpenID Connect (OIDC). In general, most identity providers that offer OIDC support work with Firezone. Some providers that only implement the OIDC partially or use uncommon configurations may have issues, however. If your identity provider falls into -this category, [contact us ](/contact/sales) about a custom integration. +this category, [contact us](/contact/sales) about a custom integration. The following OIDC providers are known to work well with Firezone: diff --git a/website/src/app/docs/layout.tsx b/website/src/app/docs/layout.tsx index c936c10d2..2ff46a653 100644 --- a/website/src/app/docs/layout.tsx +++ b/website/src/app/docs/layout.tsx @@ -1,12 +1,21 @@ import DocsSidebar from "@/components/DocsSidebar"; +import Alert from "@/components/DocsAlert"; export default function Layout({ children }: { children: React.ReactNode }) { return (
-
+
-
diff --git a/website/src/app/kb/administer/backup-restore/readme.mdx b/website/src/app/kb/administer/backup-restore/readme.mdx index c4d7df813..ca4901fc3 100644 --- a/website/src/app/kb/administer/backup-restore/readme.mdx +++ b/website/src/app/kb/administer/backup-restore/readme.mdx @@ -1 +1,17 @@ # Backup and Restore + +In Firezone 1.x and above, all configuration is kept in the Admin portal and +therefore no backup and restore procedures are necessary. WireGuard keys are +generated ephemerally each time a Client or Gateway starts and don't need to be +(nor should they be) saved. + +That said, you may want to make sure to save the following configuration +parameters in cases where you're replacing gateway VMs or headless clients tied +to service accounts: + +- The `FIREZONE_TOKEN` environment variable authenticates gateways and clients + to the portal and determines which configurations to load respectively. This + is a secret that should **always** be saved in a safe place. +- The `FIREZONE_ID` environment variable identifies gateways and clients to the + portal for metadata tracking. We recommend saving this if you'd like to + maintain consistency for display in the portal. diff --git a/website/src/app/kb/deploy/gateway/page.tsx b/website/src/app/kb/administer/dns/page.tsx similarity index 80% rename from website/src/app/kb/deploy/gateway/page.tsx rename to website/src/app/kb/administer/dns/page.tsx index 10a7283f2..3f64ce7d8 100644 --- a/website/src/app/kb/deploy/gateway/page.tsx +++ b/website/src/app/kb/administer/dns/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "Gateway Deployment • Firezone Docs", + title: "Configuring DNS • Firezone Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/administer/dns/readme.mdx b/website/src/app/kb/administer/dns/readme.mdx new file mode 100644 index 000000000..ff1af7585 --- /dev/null +++ b/website/src/app/kb/administer/dns/readme.mdx @@ -0,0 +1,39 @@ +import PlanBadge from "@/components/PlanBadge"; +import Alert from "@/components/DocsAlert"; + + + +# DNS in Firezone + +Firezone creates an internal IP for all resources in your account, including +DNS-based resources. These internal IPs are used to route traffic from the +requesting client to the appropriate gateway where the DNS query is ultimately +resolved to its actual IP address. + +This means that clients are automatically configured for Split DNS in Firezone +-- no other configuration is necessary other than adding the desired resources +in the admin portal. + +This also means that each gateway resolves IPs for clients connecting to it, so +it's important for DNS to be setup properly on the gateways in your account. + +## Configuring client DNS fallback + +For DNS names that don't match a defined resource, Firezone will use the +upstream resolvers defined at `Settings` -> `DNS` in the order they are defined. + +If no custom resolvers are configured, Firezone clients will fall back to their +default system resolver typically set by the DHCP server of their local network. + +To add custom resolvers, enter a valid IPv4 or IPv6 address and click "Save". To +remove, delete the IP address and click "Save". + + + Cloudflare or NextDNS can be used to block + malware, ads, adult material and other content for all users in your Firezone + account. + `} +/> diff --git a/website/src/app/kb/administer/logs/readme.mdx b/website/src/app/kb/administer/logs/readme.mdx index 9ef901554..87931b19f 100644 --- a/website/src/app/kb/administer/logs/readme.mdx +++ b/website/src/app/kb/administer/logs/readme.mdx @@ -1 +1,29 @@ -# Viewing Logs +# Diagnostic logs + +Firezone maintains diagnostic log files in various locations depending on the +component and operating system. Logs are scrubbed for sensitive and +personally-identifiable information before being written to disk. + +Diagnostic logs are used primarily by the Firezone team for troubleshooting +connectivity and other issues. + +Below is a table listing the various log directories used by each component. + +| Component | Log directory | +| ----------------------- | --------------------------------------------------------------------------------------- | +| macOS client | `~/Library/Group Containers/47R2M6779T.group.dev.firezone.firezone/Library/Caches/logs` | +| iOS client | N/A | +| Android/ChromeOS client | `/data/data/dev.firezone.android/caches/logs` | +| Linux client | Set by the user via the `LOG_DIR` environment variable | +| Gateway | Logs are written to STDOUT by default | + +## Exporting logs + +Log files can be conveniently exported from the macOS, iOS, Android, and +ChromeOS clients from the in-app Settings screen. + +## Clearing logs + +Simply delete the files in the log directories listed above. For macOS, iOS, +Android, and ChromeOS clients, log directies can be cleared in the "Advanced" +portion of the in-app Settings screen. diff --git a/website/src/app/kb/administer/troubleshooting/readme.mdx b/website/src/app/kb/administer/troubleshooting/readme.mdx index 663765f2b..c59f6219a 100644 --- a/website/src/app/kb/administer/troubleshooting/readme.mdx +++ b/website/src/app/kb/administer/troubleshooting/readme.mdx @@ -1 +1,14 @@ +import SupportOptions from "@/components/SupportOptions"; + # Troubleshooting Guide + +Start with this guide for solutions to common issues faced by Firezone admins +and end-users. + +1. macOS client troubleshooting guide +1. iOS client troubleshooting guide +1. Android/ChromeOS troubleshooting guide +1. Linux client troubleshooting guide +1. Gateway troubleshooting guide + + diff --git a/website/src/app/kb/administer/upgrading/readme.mdx b/website/src/app/kb/administer/upgrading/readme.mdx index d790cff18..09117dcfe 100644 --- a/website/src/app/kb/administer/upgrading/readme.mdx +++ b/website/src/app/kb/administer/upgrading/readme.mdx @@ -1 +1,57 @@ +import { HiCheck } from "react-icons/hi2"; +import { TabsItem, TabsGroup } from "@/components/DocsTabs"; + # Upgrading Firezone + +Upgrading Firezone consists of upgrading the client applications and gateways. +Read more below to understand how our versioning system works, how you can +auto-update these components, and suggestions for an upgrade strategy in +high-availability deployments. + +## How versioning works in Firezone + +Firezone uses a semantic versioning scheme in the standard +`MAJOR`.`MINOR`.`PATCH` format with the following structure: + +| Version type | Example | Explanation | +| ------------ | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `MAJOR` | `1` | Marketing version. Updates to this version generally constitute a new architecture or product. Updated every few years on average. | +| `MINOR` | `20231001` | API version. Clients and gateways **must** be the same API version to function together. The Firezone admin portal supports the latest **two** API versions at the same time. Updated every 6 months on average. | +| `PATCH` | `11` | Patch version. Represents backwards-compatible bug fixes and updates that are generally recommended for all users. Updated on average every week. | + +All Firezone components follow the structure above, so it is trivial to +determine which clients work with which gateways and for how long. + +## Auto-updates + +In general we recommend keeping clients and gateways as up-to-date as possible. +See below for auto-update details for each client. + + + + Enable auto-updates in Settings.app. + + Enable auto-updates in Settings.app. + Enable app auto-updates in Settings. + Enable app auto-updates in Settings. + + Linux auto-updates are configured by default if you deployed using the Linux + client deployment guide. + + + Gateway auto-updates are configured by default if you deployed using the + Linux client deployment guide. + + + +## Upgrading gateways with minimal downtime + +Gateways deployed in the same site will automatically +[failover](/kb/deploy/gateways#failover) for each other. By upgrading gateways +one-by-one, clients connected to the gateway being upgraded will automatically +reconnect to an available gateway. + +Currently the failover timeout is maximum 120 seconds, so upgrades should be +performed during a scheduled maintenance window to ensure minimal disruption. +Other than a possible short-term connection interruption to in-use resources, +users won't be impacted by upgrading high-availability gateways. diff --git a/website/src/app/kb/authenticate/email/page.tsx b/website/src/app/kb/authenticate/email/page.tsx index a648d89d3..68494701b 100644 --- a/website/src/app/kb/authenticate/email/page.tsx +++ b/website/src/app/kb/authenticate/email/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "Email Auth • Firezone Docs", + title: "Email Authentication • Firezone Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/authenticate/email/readme.mdx b/website/src/app/kb/authenticate/email/readme.mdx index 07fe71280..fa2b3d1de 100644 --- a/website/src/app/kb/authenticate/email/readme.mdx +++ b/website/src/app/kb/authenticate/email/readme.mdx @@ -1 +1,33 @@ -# Email Authentication +import PlanBadge from "@/components/PlanBadge"; +import Alert from "@/components/DocsAlert"; + + + +# Email authentication + +Firezone supports email authentication using a one-time password (OTP). + +This connector is enabled by default for all plans and is designed to get you up +and running with Firezone quickly. For production deployments, we highly +recommend setting up [OIDC](/kb/authenticate/oidc) or +[Google Workspace](/kb/authenticate/google). + +Firezone's OTP-based email authentication connector sends a one-time password to +the user's email each time authentication is requested. This password is +short-lived and can only be used to authenticate once. + + + +## Disabling email authentication + +The email authentication connector can be **disabled completely** for your +account, forcing all users and admins to authenticate with another connector. +However, this can lead to issues signing in if one of your other authentication +connectors stops working. For that reason, you may want to leave the email +authentication connector enabled with at least one admin for recovery purposes. diff --git a/website/src/app/kb/authenticate/google/page.tsx b/website/src/app/kb/authenticate/google/page.tsx index d9950f40c..e84fde61d 100644 --- a/website/src/app/kb/authenticate/google/page.tsx +++ b/website/src/app/kb/authenticate/google/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "Google Auth • Firezone Docs", + title: "Google Workspace Authentication • Firezone Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/authenticate/google/readme.mdx b/website/src/app/kb/authenticate/google/readme.mdx index b1e3eb901..3e0ba851f 100644 --- a/website/src/app/kb/authenticate/google/readme.mdx +++ b/website/src/app/kb/authenticate/google/readme.mdx @@ -1 +1,42 @@ -# Google Authentication +import Alert from "@/components/DocsAlert"; +import PlanBadge from "@/components/PlanBadge"; + + + +# SSO with Google Workspace + +Firezone supports authenticating users to Google Workspace using our custom +Google Workspace connector. Use this guide if you're looking to setup SSO with +Google Workspace for your Firezone Enterprise account. + +without automatic user/group sync, use our + + universal OIDC connector + instead. + `} +/> + +## Overview + +The Firezone Google Workspace connector integrates with Google's identity APIs +to support user authentication and automatic user/group sync. + +Users, groups, and organizational units are synced every few minutes to ensure +that your Firezone account remains up-to-date with the latest identity data from +your Google Workspace account. +[Read more about user / group sync here](/kb/authenticate/user-group-sync). + +## Setup + +To set up the Google workspace connector, go to `Settings` -> +`Identity Providers` -> `Add Identity Provider` and follow the prompts from +there. + +Setting up the Google Workspace connector is similar to the process of setting +up a universal OIDC connector. The main difference is the addition of a few +extra scopes needed to enable user/group sync. diff --git a/website/src/app/kb/authenticate/oidc/page.tsx b/website/src/app/kb/authenticate/oidc/page.tsx index 5f334392d..6750e5cdf 100644 --- a/website/src/app/kb/authenticate/oidc/page.tsx +++ b/website/src/app/kb/authenticate/oidc/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "OIDC Auth • Firezone Docs", + title: "OIDC Authentication • Firezone Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/authenticate/oidc/readme.mdx b/website/src/app/kb/authenticate/oidc/readme.mdx index 38e428aa1..2b2bfb805 100644 --- a/website/src/app/kb/authenticate/oidc/readme.mdx +++ b/website/src/app/kb/authenticate/oidc/readme.mdx @@ -1 +1,23 @@ -# OpenID Connect (OIDC) Authentication +import PlanBadge from "@/components/PlanBadge"; + + + +# SSO with OpenID Connect (OIDC) + +Firezone supports authenticating users with a universal OIDC connector. Use this +connector to enable SSO for any OIDC-capable identity provider. + +{/* FIXME: detailed instructions per provider */} + +## Setting up the universal OIDC connector + +To set up the universal OIDC connector, go to `Settings` -> `Identity Providers` +-> `Add Identity Provider` and follow the prompts from there. + +In general, you should follow your identity provider's documentation for setting +up an OIDC client. If the option is available, be sure to enable PKCE as well. + +For more detailed guides specific to each provider, see the +[Firezone legacy documentation](/docs/authenticate/oidc). Firezone 1.x uses the +same OIDC connector under the hood as our legacy version, so those guides should +apply for 1.x as well. diff --git a/website/src/app/kb/authenticate/page.tsx b/website/src/app/kb/authenticate/page.tsx new file mode 100644 index 000000000..19463db71 --- /dev/null +++ b/website/src/app/kb/authenticate/page.tsx @@ -0,0 +1,12 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "Authentication Overview • Firezone Docs", + description: + "Firezone supports Google Workspace, OIDC, and email authentication methods.", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/authenticate/readme.mdx b/website/src/app/kb/authenticate/readme.mdx new file mode 100644 index 000000000..ed6a7445c --- /dev/null +++ b/website/src/app/kb/authenticate/readme.mdx @@ -0,0 +1,7 @@ +# Authentication + +Firezone supports the following authentication connectors: + +1. [Email (OTP)](/kb/authenticate/email) +1. [OpenID Connect (OIDC)](/kb/authenticate/oidc) +1. [Google Workspace](/kb/authenticate/google) diff --git a/website/src/app/kb/authenticate/user-group-sync/readme.mdx b/website/src/app/kb/authenticate/user-group-sync/readme.mdx index eed0f2ae4..e48713eb7 100644 --- a/website/src/app/kb/authenticate/user-group-sync/readme.mdx +++ b/website/src/app/kb/authenticate/user-group-sync/readme.mdx @@ -1 +1,80 @@ +import Alert from "@/components/DocsAlert"; +import PlanBadge from "@/components/PlanBadge"; + + + # User / Group Sync + +Firezone supports user / group sync from Google Workspace. This feature is +**automatically enabled** for the +[Google Workspace connector](/kb/authenticate/google). Once the connector is +activated, users, groups, and organizational units will be synced from your +Google Workspace account every few minutes. + +in development. + `} +/> + +## Deleting entities + +To preserve audit log trails, Firezone never deletes synced +users or groups. + +### Deleting or suspending users + +When a user is deleted or suspended in your Google Workspace account, Firezone +will disable the user and clear all active client and admin portal web sessions +for that user upon the next user/group sync. The user will be **signed out of +all clients** and forced to reauthenticate. + +This ensures terminated employees will have all Firezone access revoked within a +few minutes of deleting or suspending them in your Google Workspace account. + +### Deleting a group or organizational unit + +Deleting a group or organizational unit in Google Workspace will hide the group +and associated policy in Firezone. + +## Nested groups and organizational units + +Firezone flattens nested groups and organizational units synced from Google +Workspace. User membership is determined **only** by its immediate parent. At +this time, Firezone does not recursively sync members from nested groups and +organizational units. + + + this GitHub issue so we can prioritize it on our roadmap. + `} +/> + +For example, if you had the following group structure in your Google Workspace +account: + +``` +- Product + - steve@company.com + - Engineering + - bob@company.com + - alice@company.com + - Support + - patrick@company.com +``` + +In Firezone, you would see the follow groups after sync: + +``` +- Group:Product + - steve@company.com +- Group:Engineering +- Group:Support + - patrick@company.com +``` diff --git a/website/src/app/kb/deploy/clients/page.tsx b/website/src/app/kb/deploy/clients/page.tsx index fc0d0f027..aa56dcd07 100644 --- a/website/src/app/kb/deploy/clients/page.tsx +++ b/website/src/app/kb/deploy/clients/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "Client Deployment • Firezone Docs", + title: "Clients • Firezone Deploy Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/deploy/clients/readme.mdx b/website/src/app/kb/deploy/clients/readme.mdx index ad21c1242..13c65e21a 100644 --- a/website/src/app/kb/deploy/clients/readme.mdx +++ b/website/src/app/kb/deploy/clients/readme.mdx @@ -1 +1,19 @@ # Deploy Clients + +Firezone provides clients for all major platforms. + +During beta, the Firezone team will provide you with invite links you can +forward to your end-users to install clients on macOS, iOS, and Android +platforms. + +On Windows and Linux platforms, you can find the latest clients published at our +[main repository releases page](https://github.com/firezone/firezone/releases). + +## End-user instructions + +Users can find more specific instructions for their respective platform below: + +1. [Apple client](/kb/user-guides/apple-client) +1. [Android client](/kb/user-guides/android-client) +1. [Windows client](/kb/user-guides/windows-client) +1. [Linux client](/kb/user-guides/linux-client) diff --git a/website/src/app/kb/deploy/gateway/readme.mdx b/website/src/app/kb/deploy/gateway/readme.mdx deleted file mode 100644 index ff3ef6aff..000000000 --- a/website/src/app/kb/deploy/gateway/readme.mdx +++ /dev/null @@ -1 +0,0 @@ -# Deploy a Gateway diff --git a/website/src/app/kb/deploy/gateways/page.tsx b/website/src/app/kb/deploy/gateways/page.tsx new file mode 100644 index 000000000..31c8b236a --- /dev/null +++ b/website/src/app/kb/deploy/gateways/page.tsx @@ -0,0 +1,11 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "Gateways • Firezone Deploy Docs", + description: "Firezone Documentation", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/deploy/gateways/readme.mdx b/website/src/app/kb/deploy/gateways/readme.mdx new file mode 100644 index 000000000..1e6da1b6d --- /dev/null +++ b/website/src/app/kb/deploy/gateways/readme.mdx @@ -0,0 +1,77 @@ +import Alert from "@/components/DocsAlert"; + +# Deploy a Gateway + +This guide covers deployment of the Firezone gateway. + +Gateways expect to have unobstructed network-level access to resources within +the same site. + +## Prerequisites + +- Any Linux distribution with kernel 5.0 or higher +- Docker Engine (for docker-based installs) +- Systemd (for systemd-based installs) + +## Resource considerations + +Gateways, like the rest of Firezone's data plane stack, are written in Rust and +are thus resource efficient by nature. A single gateway running on a 2 vCPU VM +with 1 GB of memory should be able to handle hundreds of client connections +under typical usage patterns. + +Network throughput is usually constrained by single-thread performance due to +the WireGuard state machine and overhead in the kernel network stack. Still, +most gateways should be able to saturate 1 Gbps with relative ease. Faster +speeds can be achieved with syscall optimization and multi-threaded +optimizations, both of which are currently being worked on. + +## Deploy a single gateway + +Deployed a single gateway can be accomplished in the admin portal. + +Go to `Sites` -> `` -> `Deploy a Gateway` and follow the prompts to deploy +for your preferred environment. This will deploy a single gateway. + +See the [upgrading guide](/kb/administer/upgrading) for information on keeping +your gateway up-to-date. + +## Deploy multiple gateways + +When deploying a gateway from the admin portal, a `FIREZONE_TOKEN` environment +variable is shown. This variable can be reused to deploy multiple gateways +within the same site. + +This means you can automate deployment of the gateway using your automation +method of choice, adding as many gateways as necessary for failover and load +balancing. + +Note: Be sure to set a unique FIREZONE_ID for each + gateway you deploy. This can be any non-empty string and is used to + identify the gateway in the portal for audit trail and logging purposes. + `} +/> + +## Failover + +Two or more Gateways deployed in the same site will automatically fail over and +load balance for each other. + +When the portal detects a particular gateway is unhealthy, it will stop using it +for new connection requests to resources in the site. Fail over takes around 60 +to 120 seconds for clients to time out their existing gateway connections and +fail over to a healthy one. During this time, connection to resources will be +interrupted, so it's important to plan gateway downtime appropriately. + +## Load balancing + +Load balancing happens automatically each time a client requests a connection to +a resource and uses a round-robin approach which selects a random gateway in the +site to serve the resource being requested. + +This effectively shards client connections across all gateways in a site, +achieving higher overall throughput than otherwise possible with a single +gateway. diff --git a/website/src/app/kb/deploy/policies/page.tsx b/website/src/app/kb/deploy/policies/page.tsx new file mode 100644 index 000000000..be22d2cbb --- /dev/null +++ b/website/src/app/kb/deploy/policies/page.tsx @@ -0,0 +1,11 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "Policies • Firezone Deploy Docs", + description: "Firezone Documentation", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/deploy/policies/readme.mdx b/website/src/app/kb/deploy/policies/readme.mdx new file mode 100644 index 000000000..8233a82d4 --- /dev/null +++ b/website/src/app/kb/deploy/policies/readme.mdx @@ -0,0 +1,19 @@ +import Alert from "@/components/DocsAlert"; + +# Create Policies + +Policies are what grant users access to resources. + +To define a policy, go to `Policies` -> `Add Policy`. + +Policies define a single group access to a single resource. + +Note: To preserve audit trails, policy + access cannot be changed once a policy is created. + Double-check to ensure the group and resource selected + are correct before creating the policy. + `} +/> diff --git a/website/src/app/kb/deploy/readme.mdx b/website/src/app/kb/deploy/readme.mdx index bfd2514df..d68f2f677 100644 --- a/website/src/app/kb/deploy/readme.mdx +++ b/website/src/app/kb/deploy/readme.mdx @@ -1 +1,12 @@ # Deploy Firezone + +Looking to get up and running quickly? See our +[Quickstart guide](/kb/quickstart). + +For more detailed step-by-step instructions, follow the steps below. + +1. [Create a Site](/kb/deploy/sites) +1. [Deploy a Gateway](/kb/deploy/gateways) +1. [Create a Resource](/kb/deploy/resources) +1. [Create a Policy](/kb/deploy/policies) +1. [Install Clients](/kb/deploy/clients) diff --git a/website/src/app/kb/deploy/resources/page.tsx b/website/src/app/kb/deploy/resources/page.tsx new file mode 100644 index 000000000..3509ff585 --- /dev/null +++ b/website/src/app/kb/deploy/resources/page.tsx @@ -0,0 +1,11 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "Resources • Firezone Deploy Docs", + description: "Firezone Documentation", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/deploy/resources/readme.mdx b/website/src/app/kb/deploy/resources/readme.mdx new file mode 100644 index 000000000..dfa4a5952 --- /dev/null +++ b/website/src/app/kb/deploy/resources/readme.mdx @@ -0,0 +1,20 @@ +import Alert from "@/components/DocsAlert"; + +# Create Resources + +Resources define subnets, IP addresses, or DNS names you wish to manage access +for. + +To create a resource, go to `Sites` -> `` -> `Add a resource`. Resources +are expected to be reachable by all gateways in the same site. + +DNS-based resources match the address entered and all subdomains. + +Note: To preserve audit trails, once a resource is created, + its address cannot be changed. Double-check to ensure the address entered + is correct before creating the resource. + `} +/> diff --git a/website/src/app/kb/deploy/sites/page.tsx b/website/src/app/kb/deploy/sites/page.tsx new file mode 100644 index 000000000..ba6a6a2bb --- /dev/null +++ b/website/src/app/kb/deploy/sites/page.tsx @@ -0,0 +1,11 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "Sites • Firezone Deploy Docs", + description: "Firezone Documentation", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/deploy/sites/readme.mdx b/website/src/app/kb/deploy/sites/readme.mdx new file mode 100644 index 000000000..a0189f8e4 --- /dev/null +++ b/website/src/app/kb/deploy/sites/readme.mdx @@ -0,0 +1,17 @@ +# Sites + +Sites represent a shared network environment that gateways and resources exist +in. All gateways and resources in a site should be able to reach each other. + +## Data routing + +Firezone allows you to select how data is routed to a particular site. + +Choose "Firezone Managed Relays" (Enterprise plans only) to allow data to +potentially route through the Firezone-managed Relay network when NAT hole +punching fails. Connections in Firezone are end-to-end encrypted; we can never +decrypt your traffic. + +Choose "Direct only" to enforce peer to peer connections between clients and +gateways for this site. If NAT holepunching fails for gateways in the site, +clients will be unable to connect to resources and gateways defined in the site. diff --git a/website/src/app/kb/layout.tsx b/website/src/app/kb/layout.tsx index 3248faf4e..f799daf0d 100644 --- a/website/src/app/kb/layout.tsx +++ b/website/src/app/kb/layout.tsx @@ -1,12 +1,20 @@ import KbSidebar from "@/components/KbSidebar"; +import Alert from "@/components/DocsAlert"; export default function Layout({ children }: { children: React.ReactNode }) { return (
-
+
-
+
+ View the legacy docs here. + `} + /> {children}
diff --git a/website/src/app/kb/quickstart/readme.mdx b/website/src/app/kb/quickstart/readme.mdx index 16e4f85dd..231c80a98 100644 --- a/website/src/app/kb/quickstart/readme.mdx +++ b/website/src/app/kb/quickstart/readme.mdx @@ -12,77 +12,103 @@ Welcome to the quickstart guide for Firezone className="mx-auto shadow rounded" /> - ## Prerequisites -* Firezone account (Don't have an account? Get one here https://app.firezone.dev/sign_up) -* Resource you want to give users secure access to (e.g. prod server, database, SaaS application, subnet, etc...) -* Server or VM (with the ability to deploy a docker container or Linux application) that can connect to both the resource, and the internet +- Firezone account (Don't have an account? + [Request early access](/product/early-access)) +- Resource you want to give users secure access to (e.g. prod server, database, + SaaS application, subnet, etc...) +- Server or VM (with the ability to deploy a docker container or Linux + application) that can connect to both the resource, and the internet ## Summary -1. **Sign in to your Firezone Admin Portal** - -1. **Create a Site** - Sites are where admins manage resources, and gateways that enable access to those resources (e.g. US-West, Chicago-office). - -1. **Deploy a Gateway** - Gateways are site-specific, and provide connectivity between the Firezone client and resources in a Site. - -1. **Add a Resource** - A resource is anything you'd like to give users secure access to (e.g. a server/VM, database, subnet). - -1. **Create a Policy for each Resource** - A policy defines which user-groups can access a Resource (note: access is default-deny, which means a user can't access a Resource until a Policy permitting access is created). - +1. **Sign in to your Firezone Admin Portal** (e.g. + https://app.firezone.dev/example_company) +1. **Create a Site** - Sites are where admins manage resources, and gateways + that enable access to those resources (e.g. US-West, Chicago-office). +1. **Deploy a Gateway** - Gateways are Site-specific, and provide connectivity + between the Firezone client and resources in a Site. +1. **Add a Resource** - A resource is anything you'd like to give users secure + access to (e.g. a server/VM, database, subnet). +1. **Create a Policy for each Resource** - A policy defines which user-groups + can access a Resource (note: access is default-deny, which means a user can't + access a Resource until a Policy permitting access is created). 1. **Download the Firezone Client** -This quickstart guide illustrates a simple Firezone setup. Firezone supports more complex deployments, but we like to start with the basics. - -Instructions below follow the same order as the summary above. If you follow the instructions sequentially from top to bottom, you should end up with a working Firezone network that looks like the architecture diagram at the top of this guide. +This quickstart guide illustrates a simple Firezone setup. Firezone supports +more complex deployments, but we like to start with the basics. +Instructions below follow the same order as the summary above. If you follow the +instructions sequentially from top to bottom, you should end up with a working +Firezone network that looks like the architecture diagram at the top of this +guide. ### Signing In -In your browser, visit your custom sign-in URL, which can be found in the "Welcome to Firezone" email sent after you created your account. Once on the sign-in page, enter your email and click the sign-in button. You'll receive another email with a magic link and a token. You may either click the magic link to be signed in automatically or you may copy the token value and enter it in to the form on the sign-in page. - +In your browser, visit your unique sign-in URL, which can be found in the +"Welcome to Firezone" email sent after you created your account. Once on the +sign-in page, enter your email and click the sign-in button. You'll receive +another email with a sign in link and token. You may either click the link to be +signed in automatically on the device you're using, or copy the token value and +enter it in to the form on the sign-in page. ### Create a Site -When you log in to the admin portal, you'll land on the Sites page. The first step will be to create a Site by clicking the 'Add Site' button. We'll auto-generate a name for the site, but you should consider renaming it something relevant like `Production`, `US-West`, or `Chicago-office`. After the site is created, you'll be forwarded to the Site Details page where you can continue the setup process. - +When you log in to the admin portal, you'll land on the Sites page. The first +step will be to create a Site by clicking the 'Add Site' button. We'll +auto-generate a name for the site, but you should consider renaming it something +relevant like `Production`, `US-West`, or `Chicago-office`. After the site is +created, you'll be forwarded to the Site Details page where you can continue the +setup process. ### Deploy a Gateway -Gateways run on your infrastructure (server, VM, etc.) and must have access to the internet as well as the resource you'd like to share. +Gateways run on your infrastructure (server, VM, etc.) and must have access to +the internet as well as the resource you'd like to share via Firezone. -On the Site Details page, click the 'Deploy a Gateway' button. You will be shown 2 options to deploy a Gateway: `Docker` or `Systemd` (choose whichever method you prefer, and follow the instruction on that page). - -When a Gateway has been successfully deployed, you will be notified deployment page and given the option to be redirected to the Site Details page where the gateway will now be listed and shown as online. +Clicking "Deploy a Gateway" on the Site Details page will give you two options +for deploying a Gateway: `Docker` or `Systemd` (choose whichever method you +prefer, and follow the instruction on that page). +When a Gateway has been successfully deployed, you will be redirected to the +Site Details page where the gateway will now be listed and shown as online. ### Add a Resource -A Resource is anything the site-gateway can reach, that you'd like to give users access to. Examples include servers, databases, subnets, etc... +A Resource is anything the site-gateway can reach, that you'd like to give users +access to. Examples include servers, databases, subnets, etc... -On the Site Details page, click on the 'Create a Resource' button. You will now be able to enter the `name` and `address` for a Resource. The `name` can be anything you choose, and the `address` must be one of the following: +On the Site Details page, click on the 'Create a Resource' button. You will now +be able to enter the `name` and `address` for a Resource. The `name` can be +anything you choose, and the `address` must be one of the following: - IP address - Fully Qualified Domain Name (FQDN) - CIDR Range -After creation, you'll need to create a policy authorizing user-group(s) to access the resource. Users cannot access a resource unless they are members of a group that has access. - +After adding a Resource, you'll need to create a policy authorizing one or more +user-groups to access that resource. End-users cannot access a resource unless +they are members of a group that has explicit access to that resource. ### Create a Policy -Navigate to the Policies page by clicking the 'Policies' button in the left-side menu bar. Select a resource, and choose which groups can access that resource. Save the policy. +Navigate to the Policies page by clicking the 'Policies' button in the left-side +menu bar. Select a Resource, and choose which groups can access that Resource. +Save the policy. +### Install the Firezone Client -### Download the Firezone Client +When you're finished in the Admin Portal, end-users can connect to available +resources by +[installing the Firezone client for your platform](/kb/deploy/clients), and +signing in. -When you're finished in the Admin Portal, you can connect to available resources by downloading the Firezone Client App, and signing in. +After installing the client, go to 'Settings' and enter your 'Account ID' (aka +account slug), and apply changes. If you don't recall your Account ID, you can +refer back to the "Welcome to Firezone" email that was sent when you signed up. -To download the app... - -After installing the app, go to 'Settings' and enter your 'Account ID' (aka account slug), and apply changes. If you don't recall your Account ID, you can refer back to the "Welcome to Firezone" email that was sent when you signed up. - -To sign in, close the settings window, click "Sign In" in the Firezone app, and authenticate your account. +To sign in, close the settings window, click "Sign In" in the Firezone app, and +authenticate your account. You now have secure access to resources shown in the "Resources" section. Enjoy! diff --git a/website/src/app/kb/readme.mdx b/website/src/app/kb/readme.mdx index 5ab740a70..7556bc663 100644 --- a/website/src/app/kb/readme.mdx +++ b/website/src/app/kb/readme.mdx @@ -3,6 +3,4 @@ import Image from "next/image"; # Docs Overview -Welcome to the Firezone Documentation! Use the sections below to get started. - -{/* TODO */} +Welcome to the Firezone Documentation! Use the sidebar to get started. diff --git a/website/src/app/kb/user-guides/android-client/readme.mdx b/website/src/app/kb/user-guides/android-client/readme.mdx index 1c6117ece..55e69bc70 100644 --- a/website/src/app/kb/user-guides/android-client/readme.mdx +++ b/website/src/app/kb/user-guides/android-client/readme.mdx @@ -1 +1,19 @@ # Android Client + +Firezone supports Android and ChromeOS with a native client available in the +Google Play Store. + +## Prerequisites + +- Android / ChromeOS 11 or higher (third party OSes like LineageOS or GrapheneOS + may work too but are **not** supported) +- Google Chrome browser installed + +## Installation + +The Android client is currently in beta. Your Firezone administrator will +provide you with an invite link to install and setup the Firezone Android beta +on your device. + +For more information on being an Android tester, see +[Google's documentation](https://firebase.google.com/docs/app-distribution/get-set-up-as-a-tester?platform=android). diff --git a/website/src/app/kb/user-guides/apple-client/page.tsx b/website/src/app/kb/user-guides/apple-client/page.tsx index 7e06de905..04251b3ab 100644 --- a/website/src/app/kb/user-guides/apple-client/page.tsx +++ b/website/src/app/kb/user-guides/apple-client/page.tsx @@ -2,7 +2,7 @@ import Content from "./readme.mdx"; import { Metadata } from "next"; export const metadata: Metadata = { - title: "Apple Client • Firezone Docs", + title: "Apple Clients • Firezone Docs", description: "Firezone Documentation", }; diff --git a/website/src/app/kb/user-guides/apple-client/readme.mdx b/website/src/app/kb/user-guides/apple-client/readme.mdx index c6833eefd..e4ff96b86 100644 --- a/website/src/app/kb/user-guides/apple-client/readme.mdx +++ b/website/src/app/kb/user-guides/apple-client/readme.mdx @@ -1 +1,18 @@ # Apple Client (macOS / iOS) + +Firezone supports macOS and iOS with native clients available in the macOS App +Store and iOS App Stores respectively. The iOS app also works for iPad. + +## Prerequisites + +- macOS 12 or higher, iOS 15 or higher, or iPadOS 15 or higher +- Intel and Apple silicon Macs are supported + +## Installation + +The Apple clients are currently in beta. Your Firezone administrator will +provide you with an invite link to install and setup the beta clients for your +device. + +For more information on being an Apple tester, see +[Apple's documentation](https://testflight.apple.com/). diff --git a/website/src/app/kb/user-guides/linux-client/readme.mdx b/website/src/app/kb/user-guides/linux-client/readme.mdx index 7067b25ab..77820b391 100644 --- a/website/src/app/kb/user-guides/linux-client/readme.mdx +++ b/website/src/app/kb/user-guides/linux-client/readme.mdx @@ -1 +1,16 @@ # Linux Client + +Firezone supports Linux with a native, headless client for ARM, ARM64, and Intel +x64 architectures. + +## Prerequisites + +- Any Linux-based OS with kernel 5.0 or higher +- ARM64, ARMv8, or Intel x64 CPU +- Administrator access to your Firezone account in order to create a Service + Account + +## Installation + +The Linux client is currently in beta and can be downloaded from our +[main repository's releases page](https://github.com/firezone/firezone/releases). diff --git a/website/src/app/kb/user-guides/page.tsx b/website/src/app/kb/user-guides/page.tsx new file mode 100644 index 000000000..8524d1c91 --- /dev/null +++ b/website/src/app/kb/user-guides/page.tsx @@ -0,0 +1,12 @@ +import Content from "./readme.mdx"; +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: "User Guides • Firezone Docs", + description: + "Guides designed to help end-users accomplish common tasks in Firezone.", +}; + +export default function Page() { + return ; +} diff --git a/website/src/app/kb/user-guides/readme.mdx b/website/src/app/kb/user-guides/readme.mdx new file mode 100644 index 000000000..6333a8862 --- /dev/null +++ b/website/src/app/kb/user-guides/readme.mdx @@ -0,0 +1,8 @@ +# User Guides + +Guides for common end-user workflows in Firezone. + +- [Android / ChromeOS client](/kb/user-guides/android-client) +- [macOS and iOS clients](/kb/user-guides/apple-client) +- [Windows client](/kb/user-guides/windows-client) +- [Linux client](/kb/user-guides/linux-client) diff --git a/website/src/app/kb/user-guides/windows-client/readme.mdx b/website/src/app/kb/user-guides/windows-client/readme.mdx index 4028f8bca..18ea4399b 100644 --- a/website/src/app/kb/user-guides/windows-client/readme.mdx +++ b/website/src/app/kb/user-guides/windows-client/readme.mdx @@ -1 +1,14 @@ # Windows Client + +Firezone supports Microsoft Windows with a native client for ARM64 and Intel x64 +architectures. + +## Prerequisites + +- Windows 10 or higher +- arm64 or x64 CPU + +## Installation + +The Windows client is currently in beta and can be downloaded from our +[main repository's releases page](https://github.com/firezone/firezone/releases). diff --git a/website/src/app/page.tsx b/website/src/app/page.tsx index 64deb9b46..8d252569d 100644 --- a/website/src/app/page.tsx +++ b/website/src/app/page.tsx @@ -37,7 +37,7 @@ export default function Page() { @@ -60,7 +60,7 @@ export default function Page() {
  • - Authenticate with magic link and OIDC + Authenticate with email and OIDC
  • @@ -91,7 +91,7 @@ export default function Page() { diff --git a/website/src/app/pricing/plan_table.tsx b/website/src/app/pricing/plan_table.tsx index dc9fbc74b..882e0c5aa 100644 --- a/website/src/app/pricing/plan_table.tsx +++ b/website/src/app/pricing/plan_table.tsx @@ -381,7 +381,7 @@ export default function PlanTable() { @@ -391,7 +391,7 @@ export default function PlanTable() { diff --git a/website/src/components/CommitMarquee/index.tsx b/website/src/components/CommitMarquee/index.tsx deleted file mode 100644 index 146b8876c..000000000 --- a/website/src/components/CommitMarquee/index.tsx +++ /dev/null @@ -1,72 +0,0 @@ -"use client"; - -import Link from "next/link"; -import Image from "next/image"; -import { XMLParser } from "fast-xml-parser"; -import { useState, useEffect } from "react"; -import Marquee from "react-fast-marquee"; - -export default function CommitMarquee({ xmlFeed }: { xmlFeed: string }) { - const parser = new XMLParser({ ignoreAttributes: false }); - const [xml, setXml] = useState({ feed: { title: "", entry: [] } }); - - useEffect(() => { - fetch(xmlFeed) - .then((response) => response.text()) - .then((str) => parser.parse(str)) - .then((data) => { - setXml(data); - }) - .catch((error) => console.error(error)); - }, []); - - return ( -
    -

    - {xml.feed.title} -

    - - {xml.feed.entry.map((entry: any) => ( -
    -

    - - {entry.title.replace(/\(#.*\)/, "")} - -

    -

    - user avatar -

    -

    - - {entry.author.name} - {" "} -

    -

    - {new Date(entry.updated).toDateString()} -

    -
    - ))} -     -
    - ); -} diff --git a/website/src/components/DocsSidebar/Collapse.tsx b/website/src/components/DocsSidebar/Collapse.tsx index 1e2a4a766..3b9b97cfc 100644 --- a/website/src/components/DocsSidebar/Collapse.tsx +++ b/website/src/components/DocsSidebar/Collapse.tsx @@ -12,16 +12,13 @@ export default function Collapse({ }) { const ctl = label.toLowerCase().replace(" ", "-") + "-dropdown"; const indent = "ml-3"; - const hidden = expanded ? "" : "hidden"; - const text = expanded ? "bg-neutral-100 " : "text-neutral-900 "; - const [expandedState, setExpandedState] = useState(expanded); + const [expandedState, setExpandedState] = useState(false); return ( <> -
      +
        {children}
      diff --git a/website/src/components/DocsTabs/index.tsx b/website/src/components/DocsTabs/index.tsx index 3040b5866..769bf0fb2 100644 --- a/website/src/components/DocsTabs/index.tsx +++ b/website/src/components/DocsTabs/index.tsx @@ -1,10 +1,76 @@ "use client"; import { Tabs as FlowbiteTabs } from "flowbite-react"; +import type { CustomFlowbiteTheme } from "flowbite-react"; + +// Copied from https://www.flowbite-react.com/docs/components/tabs and then modified +const customTheme: CustomFlowbiteTheme["tab"] = { + base: "flex flex-col gap-2", + tablist: { + base: "flex text-center", + styles: { + default: "flex-wrap border-b border-neutral-200", + underline: "flex-wrap -mb-px border-b border-neutral-200", + pills: "flex-wrap font-medium text-sm text-neutral-500 space-x-2", + fullWidth: + "w-full text-sm font-medium divide-x divide-neutral-200 shadow grid grid-flow-colrounded-none", + }, + tabitem: { + base: "flex items-center justify-center p-4 rounded-t-lg text-sm font-medium first:ml-0 disabled:cursor-not-allowed disabled:text-neutral-400", + styles: { + default: { + base: "rounded-t-lg", + active: { + on: "bg-neutral-100 text-neutral-600", + off: "text-neutral-500 hover:bg-neutral-50 hover:text-neutral-600", + }, + }, + underline: { + base: "rounded-t-lg", + active: { + on: "text-accent-600 rounded-t-lg border-b-2 border-accent-600 active", + off: "border-b-2 border-transparent text-neutral-500 hover:border-accent-200 hover:text-accent-600", + }, + }, + pills: { + base: "", + active: { + on: "rounded-lg bg-neutral-600 text-white", + off: "rounded-lg hover:text-neutral-900 hover:bg-neutral-100", + }, + }, + fullWidth: { + base: "ml-0 first:ml-0 w-full rounded-none flex", + active: { + on: "p-4 text-neutral-900 bg-neutral-100 active rounded-none", + off: "bg-white hover:text-neutral-700 hover:bg-neutral-50 rounded-none", + }, + }, + }, + icon: "mr-2 h-5 w-5", + }, + }, + tabitemcontainer: { + base: "", + styles: { + default: "", + underline: "", + pills: "", + fullWidth: "", + }, + }, + tabpanel: "p-3", +}; function TabsGroup({ children }: { children: React.ReactNode }) { return (
      - {children} + + {children} +
      ); } diff --git a/website/src/components/Footer/index.tsx b/website/src/components/Footer/index.tsx index d833514cb..413b613a6 100644 --- a/website/src/components/Footer/index.tsx +++ b/website/src/components/Footer/index.tsx @@ -198,7 +198,7 @@ export default function Footer() {
      - +
    • diff --git a/website/src/components/KbSidebar/Collapse.tsx b/website/src/components/KbSidebar/Collapse.tsx index 1e2a4a766..3b9b97cfc 100644 --- a/website/src/components/KbSidebar/Collapse.tsx +++ b/website/src/components/KbSidebar/Collapse.tsx @@ -12,16 +12,13 @@ export default function Collapse({ }) { const ctl = label.toLowerCase().replace(" ", "-") + "-dropdown"; const indent = "ml-3"; - const hidden = expanded ? "" : "hidden"; - const text = expanded ? "bg-neutral-100 " : "text-neutral-900 "; - const [expandedState, setExpandedState] = useState(expanded); + const [expandedState, setExpandedState] = useState(false); return ( <> -
      +
        {children}
      diff --git a/website/src/components/KbSidebar/index.tsx b/website/src/components/KbSidebar/index.tsx index e95ca8f07..c28acac79 100644 --- a/website/src/components/KbSidebar/index.tsx +++ b/website/src/components/KbSidebar/index.tsx @@ -7,12 +7,14 @@ import SearchForm from "./SearchForm"; import { usePathname } from "next/navigation"; export default function KbSidebar() { + const p = usePathname() || ""; + useEffect(() => { // Manually init flowbite's data-toggle listeners since we're using custom components initFlowbite(); }, []); - const p = usePathname() || ""; + console.log(p); return ( ); diff --git a/website/src/components/PlanBadge/index.tsx b/website/src/components/PlanBadge/index.tsx new file mode 100644 index 000000000..f58c78cd2 --- /dev/null +++ b/website/src/components/PlanBadge/index.tsx @@ -0,0 +1,26 @@ +function planBadge(plan: string) { + switch (plan.toLowerCase()) { + case "enterprise": + return ( + + ENTERPRISE + + ); + case "starter": + return ( + + STARTER + + ); + } +} +export default function PlanBadge({ plans }: { plans: Array }) { + const plansHtml = plans.map((plan) => planBadge(plan)); + return
      {plansHtml}
      ; +} diff --git a/website/src/components/RequestAccessButton/index.tsx b/website/src/components/RequestAccessButton/index.tsx index 2f9220518..3b5c92f68 100644 --- a/website/src/components/RequestAccessButton/index.tsx +++ b/website/src/components/RequestAccessButton/index.tsx @@ -6,7 +6,7 @@ export default function RequestAccessButton() { diff --git a/website/src/components/RequestDemoButton/index.tsx b/website/src/components/RequestDemoButton/index.tsx index 157272782..4d0e6ddc4 100644 --- a/website/src/components/RequestDemoButton/index.tsx +++ b/website/src/components/RequestDemoButton/index.tsx @@ -6,7 +6,7 @@ export default function RequestDemoButton() { diff --git a/website/src/components/RootNavbar/SidebarToggle.tsx b/website/src/components/RootNavbar/DocsSidebarToggle.tsx similarity index 93% rename from website/src/components/RootNavbar/SidebarToggle.tsx rename to website/src/components/RootNavbar/DocsSidebarToggle.tsx index 2d17f80a3..701818c05 100644 --- a/website/src/components/RootNavbar/SidebarToggle.tsx +++ b/website/src/components/RootNavbar/DocsSidebarToggle.tsx @@ -1,7 +1,7 @@ import { usePathname } from "next/navigation"; import { HiBars3 } from "react-icons/hi2"; -export default function SidebarToggle() { +export default function DocsSidebarToggle() { const p = usePathname() || ""; if (p.startsWith("/docs")) { diff --git a/website/src/components/RootNavbar/KbSidebarToggle.tsx b/website/src/components/RootNavbar/KbSidebarToggle.tsx new file mode 100644 index 000000000..e28d56292 --- /dev/null +++ b/website/src/components/RootNavbar/KbSidebarToggle.tsx @@ -0,0 +1,23 @@ +import { usePathname } from "next/navigation"; +import { HiBars3 } from "react-icons/hi2"; + +export default function KbSidebarToggle() { + const p = usePathname() || ""; + + if (p.startsWith("/kb")) { + return ( + + ); + } else { + return null; + } +} diff --git a/website/src/components/RootNavbar/index.tsx b/website/src/components/RootNavbar/index.tsx index 01d8e3df2..e8182ffa9 100644 --- a/website/src/components/RootNavbar/index.tsx +++ b/website/src/components/RootNavbar/index.tsx @@ -1,7 +1,8 @@ "use client"; import Image from "next/image"; import Link from "next/link"; -import SidebarToggle from "./SidebarToggle"; +import DocsSidebarToggle from "./DocsSidebarToggle"; +import KbSidebarToggle from "./KbSidebarToggle"; import { Navbar } from "flowbite-react"; import { usePathname } from "next/navigation"; import RequestDemoButton from "@/components/RequestDemoButton"; @@ -11,28 +12,43 @@ import { HiChevronDown } from "react-icons/hi2"; export default function RootNavbar() { const p = usePathname() || ""; - let dropdown: any = null; + let productDropdown: any = null; + let docsDropdown: any = null; useEffect(() => { - if (!dropdown) { - dropdown = new Dropdown( + if (!productDropdown) { + productDropdown = new Dropdown( document.getElementById("product-dropdown-menu"), document.getElementById("product-dropdown-link") ); } + if (!docsDropdown) { + docsDropdown = new Dropdown( + document.getElementById("docs-dropdown-menu"), + document.getElementById("docs-dropdown-link") + ); + } // Manually init flowbite's data-toggle listeners since we're using custom components initFlowbite(); }, []); const hideDropdown = () => { - if (!dropdown) { - dropdown = new Dropdown( + if (!productDropdown) { + productDropdown = new Dropdown( document.getElementById("product-dropdown-menu"), document.getElementById("product-dropdown-link") ); } - dropdown.hide(); + if (!docsDropdown) { + docsDropdown = new Dropdown( + document.getElementById("docs-dropdown-menu"), + document.getElementById("docs-dropdown-link") + ); + } + + productDropdown.hide(); + docsDropdown.hide(); }; return ( @@ -40,7 +56,8 @@ export default function RootNavbar() {
    + + Blog + + +
    + +
  • - Discussion Forums + Discussion forums : Ask questions, report bugs, and suggest features.
  • - Public Slack Group + Public Slack group : join discussions, meet other users, and meet the contributors
    • diff --git a/website/tailwind.config.js b/website/tailwind.config.js index 0a6c8d481..d3a38330c 100644 --- a/website/tailwind.config.js +++ b/website/tailwind.config.js @@ -58,7 +58,7 @@ module.exports = { typography: { DEFAULT: { css: { - color: firezoneColors["night-rider"][900], + color: firezoneColors["night-rider"][800], a: { color: firezoneColors["electric-violet"][500], },