diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts index 936b5b8d..fcde6c94 100644 --- a/docs/.vitepress/config.mts +++ b/docs/.vitepress/config.mts @@ -138,7 +138,7 @@ export default withMermaid( "Self-host Plane, integrate with our API, configure webhooks, and extend your project management platform.", }, ], - ["meta", { property: "og:image", content: "https://media.docs.plane.so/logo/og-docs.webp" }], + ["meta", { property: "og:image", content: "https://media.docs.plane.so/logo/og-docs.webp#hero" }], ["meta", { property: "og:url", content: "https://developers.plane.so" }], // Twitter Card meta tags @@ -152,7 +152,7 @@ export default withMermaid( "Self-host Plane, integrate with our API, configure webhooks, and extend your project management platform.", }, ], - ["meta", { name: "twitter:image", content: "https://media.docs.plane.so/logo/og-docs.webp" }], + ["meta", { name: "twitter:image", content: "https://media.docs.plane.so/logo/og-docs.webp#hero" }], ], transformPageData(pageData) { @@ -319,6 +319,7 @@ export default withMermaid( { text: "View Logs", link: "/self-hosting/manage/view-logs" }, { text: "Migrate Plane", link: "/self-hosting/manage/migrate-plane" }, { text: "Prime CLI", link: "/self-hosting/manage/prime-cli" }, + { text: "Manage users", link: "/self-hosting/manage/manage-instance-users" }, ], }, { diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index 22166cfd..169386ea 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -1,7 +1,9 @@ import DefaultTheme from "vitepress/theme"; import type { Theme } from "vitepress"; -import { onMounted, nextTick, h } from "vue"; +import { onMounted, watch, nextTick, h } from "vue"; +import { useRoute } from "vitepress"; import { enhanceAppWithTabs } from "vitepress-plugin-tabs/client"; +import mediumZoom from "medium-zoom"; import "./style.css"; import "vitepress-plugin-tabs/client"; @@ -126,27 +128,48 @@ export default { router.onAfterRouteChanged = () => { nextTick(() => { updateLayout(); - handleTabHash(); - setupTabHashUpdates(); }); }; + } + }, + setup() { + if (typeof window === "undefined") return; + + const route = useRoute(); + let zoom: ReturnType | null = null; + + const initZoom = () => { + zoom?.detach(); + zoom = mediumZoom(".vp-doc :not(a) > img:not(.VPImage)", { + background: "rgba(0, 0, 0, 0.8)", + }); + }; + + onMounted(() => { + initZoom(); + + // Delay tab hash handling to ensure tabs are rendered + setTimeout(() => { + handleTabHash(); + setupTabHashUpdates(); + }, 100); // Listen for hash changes window.addEventListener("hashchange", () => { nextTick(handleTabHash); }); - } - }, - setup() { - if (typeof window !== "undefined") { - onMounted(() => { - updateLayout(); - // Delay tab hash handling to ensure tabs are rendered - setTimeout(() => { + }); + + // Watch for route changes + watch( + () => route.path, + () => { + nextTick(() => { + initZoom(); handleTabHash(); setupTabHashUpdates(); - }, 100); - }); - } + }); + }, + ); }, } satisfies Theme; diff --git a/docs/.vitepress/theme/style.css b/docs/.vitepress/theme/style.css index df1dc05e..fb130f8d 100644 --- a/docs/.vitepress/theme/style.css +++ b/docs/.vitepress/theme/style.css @@ -663,3 +663,198 @@ a.VPLink.VPNavBarMenuLink[href*="sign-in"]:hover { background: #0078b8 !important; box-shadow: 0 2px 8px rgba(0, 99, 153, 0.35) !important; } + + +/* ================================================ + HERO IMAGE STYLES + ================================================ */ + +.vp-doc p:has(> img[src$="#hero"]), +article p:has(> img[src$="#hero"]) { + max-width: 841px; + padding: 36px 56px 0px 56px; + background: #f1f3f3; + border-radius: 12px; + box-sizing: border-box; + overflow: hidden; +} + +.vp-doc img[src$="#hero"], +article img[src$="#hero"] { + width: 100%; + height: auto; + display: block; + margin: 0; + border-radius: 8px 8px 0px 0px; + border-width: 1px 1px 0px 1px; + border-style: solid; + border-color: #eaebeb; + object-fit: cover; + box-shadow: + 0px 2px 4px -1px rgba(41, 47, 61, 0.04), + 0px 4px 6px -1px rgba(41, 47, 61, 0.05); +} + +.vp-doc p:has(> img[src$="#hero-tl"]), +article p:has(> img[src$="#hero-tl"]) { + max-width: 841px; + padding: 36px 0px 0px 56px; + background: #f1f3f3; + border-radius: 12px; + box-sizing: border-box; + overflow: hidden; +} + +.vp-doc img[src$="#hero-tl"], +article img[src$="#hero-tl"] { + width: 100%; + height: auto; + display: block; + margin: 0; + border-radius: 8px 0px 0px 0px; + border-width: 1px 0px 0px 1px; + border-style: solid; + border-color: #eaebeb; + object-fit: cover; + box-shadow: + 0px 2px 4px -1px rgba(41, 47, 61, 0.04), + 0px 4px 6px -1px rgba(41, 47, 61, 0.05); +} + +.vp-doc p:has(> img[src$="#hero-tr"]), +article p:has(> img[src$="#hero-tr"]) { + max-width: 841px; + padding: 36px 56px 0px 0px; + background: #f1f3f3; + border-radius: 12px; + box-sizing: border-box; + overflow: hidden; +} + +.vp-doc img[src$="#hero-tr"], +article img[src$="#hero-tr"] { + width: 100%; + height: auto; + display: block; + margin: 0; + border-radius: 0px 8px 0px 0px; + border-width: 1px 1px 0px 0px; + border-style: solid; + border-color: #eaebeb; + object-fit: cover; + box-shadow: + 0px 2px 4px -1px rgba(41, 47, 61, 0.04), + 0px 4px 6px -1px rgba(41, 47, 61, 0.05); +} + +.vp-doc p:has(> img[src$="#hero-bl"]), +article p:has(> img[src$="#hero-bl"]) { + max-width: 841px; + padding: 0px 0px 36px 56px; + background: #f1f3f3; + border-radius: 12px; + box-sizing: border-box; + overflow: hidden; +} + +.vp-doc img[src$="#hero-bl"], +article img[src$="#hero-bl"] { + width: 100%; + height: auto; + display: block; + margin: 0; + border-radius: 0px 0px 0px 8px; + border-width: 0px 0px 1px 1px; + border-style: solid; + border-color: #eaebeb; + object-fit: cover; + box-shadow: + 0px 2px 4px -1px rgba(41, 47, 61, 0.04), + 0px 4px 6px -1px rgba(41, 47, 61, 0.05); +} + +.vp-doc p:has(> img[src$="#hero-br"]), +article p:has(> img[src$="#hero-br"]) { + max-width: 841px; + padding: 0px 56px 36px 0px; + background: #f1f3f3; + border-radius: 12px; + box-sizing: border-box; + overflow: hidden; +} + +.vp-doc img[src$="#hero-br"], +article img[src$="#hero-br"] { + width: 100%; + height: auto; + display: block; + margin: 0; + border-radius: 0px 0px 8px 0px; + border-width: 0px 1px 1px 0px; + border-style: solid; + border-color: #eaebeb; + object-fit: cover; + box-shadow: + 0px 2px 4px -1px rgba(41, 47, 61, 0.04), + 0px 4px 6px -1px rgba(41, 47, 61, 0.05); +} + +/* ================================================ + MOBILE IMAGE LAYOUT + ================================================ */ + +.mobile-img-container { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} + +.mobile-img-box { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + max-width: 25rem; + min-width: 15rem; + text-align: center; + margin: 10px; +} + +/* ================================================ + HOMEPAGE FEATURE ICONS - DARK MODE + ================================================ */ + +/* Feature card icons use currentColor in SVG, but since they're + loaded as tags, currentColor defaults to black. This filter + inverts them for visibility in dark mode. */ +.dark .VPFeature .VPImage { + filter: invert(1) hue-rotate(180deg); +} + +.dark .VPFeatures .VPFeature .icon img { + filter: invert(1) hue-rotate(180deg); +} + +/* ================================================ + MEDIUM ZOOM - IMAGE LIGHTBOX + ================================================ */ + +.vp-doc img { + cursor: zoom-in; +} + +.medium-zoom-overlay { + z-index: 9999 !important; + background: rgba(0, 0, 0, 0.8) !important; +} + +.medium-zoom-image { + z-index: 10000 !important; +} + +.medium-zoom-image--opened { + z-index: 10000 !important; + cursor: zoom-out; +} \ No newline at end of file diff --git a/docs/public/images/instance-admin/god-mode-authentication.webp b/docs/public/images/instance-admin/god-mode-authentication.webp index 1c7a4887..222affa7 100644 Binary files a/docs/public/images/instance-admin/god-mode-authentication.webp and b/docs/public/images/instance-admin/god-mode-authentication.webp differ diff --git a/docs/public/images/instance-admin/god-mode-email.webp b/docs/public/images/instance-admin/god-mode-email.webp index 68bd3b5d..bcf7a7e3 100644 Binary files a/docs/public/images/instance-admin/god-mode-email.webp and b/docs/public/images/instance-admin/god-mode-email.webp differ diff --git a/docs/public/images/instance-admin/god-mode-general.webp b/docs/public/images/instance-admin/god-mode-general.webp index 39b78ee5..b6548ca7 100644 Binary files a/docs/public/images/instance-admin/god-mode-general.webp and b/docs/public/images/instance-admin/god-mode-general.webp differ diff --git a/docs/public/images/instance-admin/god-mode-workspaces.webp b/docs/public/images/instance-admin/god-mode-workspaces.webp index 88ccfd6f..100d6146 100644 Binary files a/docs/public/images/instance-admin/god-mode-workspaces.webp and b/docs/public/images/instance-admin/god-mode-workspaces.webp differ diff --git a/docs/public/images/instance-admin/invite-instance-admin.webp b/docs/public/images/instance-admin/invite-instance-admin.webp new file mode 100644 index 00000000..1685a4df Binary files /dev/null and b/docs/public/images/instance-admin/invite-instance-admin.webp differ diff --git a/docs/public/images/instance-admin/user-actions.webp b/docs/public/images/instance-admin/user-actions.webp new file mode 100644 index 00000000..e0695205 Binary files /dev/null and b/docs/public/images/instance-admin/user-actions.webp differ diff --git a/docs/public/images/instance-admin/user-management.webp b/docs/public/images/instance-admin/user-management.webp new file mode 100644 index 00000000..b2ab3452 Binary files /dev/null and b/docs/public/images/instance-admin/user-management.webp differ diff --git a/docs/self-hosting/govern/advanced-search.md b/docs/self-hosting/govern/advanced-search.md index e26a7836..8d426d7f 100644 --- a/docs/self-hosting/govern/advanced-search.md +++ b/docs/self-hosting/govern/advanced-search.md @@ -264,7 +264,7 @@ The batching pattern also provides resilience. If OpenSearch is temporarily unav ### The complete flow -![OpenSeach flow](/images/open-search/opensearch-flow.webp) +![OpenSeach flow](/images/open-search/opensearch-flow.webp#hero) When you search, queries bypass this synchronization process entirely. The Plane API sends your search query directly to OpenSearch, which returns results almost instantly. Your database isn't involved in search queries at all — this is the key to search performance. diff --git a/docs/self-hosting/govern/instance-admin.md b/docs/self-hosting/govern/instance-admin.md index e81a7aec..ba06cac8 100644 --- a/docs/self-hosting/govern/instance-admin.md +++ b/docs/self-hosting/govern/instance-admin.md @@ -10,7 +10,6 @@ An instance is a single self-managed installation of Plane on a private cloud or ::: info There may also be cases where a user IRL is running multiple instances, e.g., when using Plane for several clients. An `Instance admin` role will have to be declared for each of those instances, but it is okay to use the same email address for all of them. - ::: This role lets instance admins access `/god-mode`, a route for features that help them administer and govern their Plane instance better for all users of that instance. @@ -43,7 +42,28 @@ Here’s what you can manage: - **Let Plane collect anonymous usage data** Plane collects anonymized usage data (no PII) to help improve features and overall experience. You can turn this off anytime. See [Telemetry](/self-hosting/telemetry) for more info. -![](/images/instance-admin/god-mode-general.webp) +![](/images/instance-admin/god-mode-general.webp#hero) + +### Email + +Set up your SMTP server here so you can send essential emails—password resets, exports, changes to your instance—and Plane-enabled emails—onboarding, tips and tricks, new features— to all your users. [Learn more here](/self-hosting/govern/communication). + +![](/images/instance-admin/god-mode-email.webp#hero) + +### Authentication + +Control what SSO and OAuth services your users can use to sign up and log in to your Plane instance. You can also toggle unique code and password logins on and off from here. [Learn more here](/self-hosting/govern/authentication). + +- **Allow anyone to sign up without an invite** + Toggle this setting off if you want your users to join the instance only if they receive an invite. + +Once SSO is configured, instance admins can also use SSO to log in to God Mode. + +::: info +This is where you will see new SSO services and custom OAuth configs in the future. +::: + +![](/images/instance-admin/god-mode-authentication.webp#hero) ### Workspaces @@ -64,54 +84,29 @@ To add users to a workspace, you will need to [invite them](https://docs.plane.s Workspace deletion is currently not supported. ::: -![](/images/instance-admin/god-mode-workspaces.webp) +![](/images/instance-admin/god-mode-workspaces.webp#hero) -### Email -Set up your SMTP server here so you can send essential emails—password resets, exports, changes to your instance—and Plane-enabled emails—onboarding, tips and tricks, new features— to all your users. [Learn more here](/self-hosting/govern/communication). - -![](/images/instance-admin/god-mode-email.webp) +### User management -### Authentication - -Control what SSO and OAuth services your users can use to sign up and log in to your Plane instance. You can also toggle unique code and password logins on and off from here. [Learn more here](/self-hosting/govern/authentication). +View and manage all users across the instance, invite instance admins, and control access to God Mode. -- **Allow anyone to sign up without an invite** - Toggle this setting off if you want your users to join the instance only if they receive an invite. +![User management](/images/instance-admin/user-management.webp#hero) -::: info -This is where you will see new SSO services and custom OAuth configs in the future. -::: +- View all users with their account type, status, and joining date +- Invite new instance admins +- Grant or remove admin access for existing users +- Remove users from the instance -![](/images/instance-admin/god-mode-authentication.webp) +See [User management](/self-hosting/manage/manage-instance-users) for details. -### Artificial intelligence - -Plane supports the use of AI throughout your projects. For now, we support OpenAI’s APIs and keys. You can configure them here or leave them blank if you don’t wish to offer AI features to your users. Your Plane experience remains largely unchanged if you don’t set this up. - -![](/images/instance-admin/god-mode-ai.webp) ### Images in Plane You can use your own third-party libraries to update images in project settings. Configure your Unsplash key here. When we add more image libraries, they will show up here. -![](/images/instance-admin/god-mode-images.webp) - -## Add instance admin - -To grant a user full administrative access (including God mode) to your self-hosted Plane instance, you'll need to assign them the Instance Admin role. Instance admins have unrestricted control over all configurations and settings within the instance. - -To promote an existing user to Instance Admin, execute the following command in your terminal: - -```bash - docker exec /bin/bash -c "python manage.py create_instance_admin " -``` - -Ensure that the provided email matches the user's registered account. This command will instantly elevate their privileges to full administrative access. - ---- +![](/images/instance-admin/god-mode-images.webp#hero) -Soon, we will introduce God Mode for our Cloud users as well so they can manage their workspaces better. To get notified about this, [sign up here](https://ece39166.sibforms.com/serve/MUIFANgaMWIARsq1n0lMNrch19pdY2HJm9FkSXAeq1DrCoXJBmO9Yq6SPgtzu7rL0lQBmCvvz2A2arVl5WaDxYu6YhNW4PKNAis0DMXmpRnwm5633BvXqIYILqZuyqYiGS7_QjJ0Ozh4R2uctd8RwiiTLSHWpnV2njQt6DPV5cVr8FH3K-TouNAlBScOJxbCpjj8fYo2ULsEJeAL). ## FAQs diff --git a/docs/self-hosting/govern/integrations/github.md b/docs/self-hosting/govern/integrations/github.md index 974f77d6..b787b56a 100644 --- a/docs/self-hosting/govern/integrations/github.md +++ b/docs/self-hosting/govern/integrations/github.md @@ -43,10 +43,10 @@ Follow these steps to create a GitHub App, set callback URLs, and configure webh 1. Go to **Settings \> Developer Settings \> GitHub Apps** in your GitHub organization. 2. Click **New GitHub App**. - ![Create GitHub App](/images/integrations/github/create-github-app.webp) + ![Create GitHub App](/images/integrations/github/create-github-app.webp#hero) 3. In the **Register new GitHub App** page, provide a **GitHub App name** and **Homepage URL**. - ![App name and homepage URL](/images/integrations/github/app-name-homepage-url.webp) + ![App name and homepage URL](/images/integrations/github/app-name-homepage-url.webp#hero) 4. In the **Identifying and authorizing users** section, add the following **Callback URLS**. @@ -56,7 +56,7 @@ Follow these steps to create a GitHub App, set callback URLs, and configure webh ``` These URLs allow Plane to verify and enable workspace connection with the Github App. - ![Add Callback URL](/images/integrations/github/add-callback-url.webp) + ![Add Callback URL](/images/integrations/github/add-callback-url.webp#hero) 5. In the **Post installation** section, add the below **Setup URL**. @@ -65,7 +65,7 @@ Follow these steps to create a GitHub App, set callback URLs, and configure webh ``` Redirects users to this URL after GitHub app installation. - ![Add setup URL](/images/integrations/github/add-setup-url.webp) + ![Add setup URL](/images/integrations/github/add-setup-url.webp#hero) 6. Turn on **Redirect on update**. @@ -77,7 +77,7 @@ Follow these steps to create a GitHub App, set callback URLs, and configure webh This allows Plane to receive updates from GitHub repositories. - ![Add Webhook URL](/images/integrations/github/add-webhook-url.webp) + ![Add Webhook URL](/images/integrations/github/add-webhook-url.webp#hero) == GitHub Enterprise Server {#github-enterprise-server} These steps cover hostname, callback URLs, and private key differences for on‑prem GitHub deployments. @@ -87,10 +87,10 @@ These steps cover hostname, callback URLs, and private key differences for on‑ 1. Go to **Settings \> Developer Settings \> GitHub Apps** in your GitHub organization. 2. Click **New GitHub App**. - ![Create GitHub App](/images/integrations/github/create-github-app.webp) + ![Create GitHub App](/images/integrations/github/create-github-app.webp#hero) 3. In the **Register new GitHub App** page, provide a **GitHub App name** and **Homepage URL**. - ![App name and homepage URL](/images/integrations/github/app-name-homepage-url.webp) + ![App name and homepage URL](/images/integrations/github/app-name-homepage-url.webp#hero) 4. In the **Identifying and authorizing users** section, add the following **Callback URLS**. @@ -109,7 +109,7 @@ These steps cover hostname, callback URLs, and private key differences for on‑ ``` These URLs allow Plane to verify and enable workspace connection with the Github App. - ![Add Callback URL](/images/integrations/github/add-callback-url.webp) + ![Add Callback URL](/images/integrations/github/add-callback-url.webp#hero) 5. In the **Post installation** section, add the below **Setup URL**. @@ -126,7 +126,7 @@ These steps cover hostname, callback URLs, and private key differences for on‑ ``` Redirects users to this URL after GitHub app installation. - ![Add setup URL](/images/integrations/github/add-setup-url.webp) + ![Add setup URL](/images/integrations/github/add-setup-url.webp#hero) 6. Turn on **Redirect on update**. @@ -146,14 +146,14 @@ These steps cover hostname, callback URLs, and private key differences for on‑ This allows Plane to receive updates from GitHub repositories. - ![Add Webhook URL](/images/integrations/github/add-webhook-url.webp) + ![Add Webhook URL](/images/integrations/github/add-webhook-url.webp#hero) ::: ### Set up permissions and events 1. Add repository and account permissions by setting the **Access** dropdown next to each permission, as shown in the tables below. - ![Setup permissions](/images/integrations/github/setup-permissions.webp) + ![Setup permissions](/images/integrations/github/setup-permissions.webp#hero) **Repository permissions** @@ -172,7 +172,7 @@ These steps cover hostname, callback URLs, and private key differences for on‑ 2. In the **Subscribe to events** section, turn on all the required events below. - ![Subscribe to events](/images/integrations/github/subscribe-to-events.webp) + ![Subscribe to events](/images/integrations/github/subscribe-to-events.webp#hero) | Event                                             | Purpose | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | @@ -201,11 +201,11 @@ These steps cover hostname, callback URLs, and private key differences for on‑ 3. In the **General** tab, under the **Client secrets** section, click **Generate a new client secret**. - ![General tab](/images/integrations/github/general-tab.webp) + ![General tab](/images/integrations/github/general-tab.webp#hero) 4. Scroll down to the **Private keys** section. - ![Private keys](/images/integrations/github/private-keys.webp) + ![Private keys](/images/integrations/github/private-keys.webp#hero) 5. Click **Genereate a private key**. @@ -244,11 +244,11 @@ These steps cover hostname, callback URLs, and private key differences for on‑ 3. In the **General** tab, under the **Client secrets** section, click **Generate a new client secret**. - ![General tab](/images/integrations/github/general-tab.webp) + ![General tab](/images/integrations/github/general-tab.webp#hero) 4. Scroll down to the **Private keys** section. - ![Private keys](/images/integrations/github/private-keys.webp) + ![Private keys](/images/integrations/github/private-keys.webp#hero) 5. Click **Generate a private key**. diff --git a/docs/self-hosting/govern/integrations/gitlab.md b/docs/self-hosting/govern/integrations/gitlab.md index 85b95c0c..fdf73a1d 100644 --- a/docs/self-hosting/govern/integrations/gitlab.md +++ b/docs/self-hosting/govern/integrations/gitlab.md @@ -45,7 +45,7 @@ and then configure your Plane instance so it can sync merge requests and commits 3. Navigate to the **Applications** tab. 4. Click on **Add new application** to begin the setup. - ![Add GitLab application](/images/integrations/gitlab/add-gitlab-application.webp) + ![Add GitLab application](/images/integrations/gitlab/add-gitlab-application.webp#hero) 5. Provide a **Name** for your application. @@ -55,7 +55,7 @@ and then configure your Plane instance so it can sync merge requests and commits ``` 7. Check the **Confidential** box. - ![Add app details](/images/integrations/gitlab/add-app-details.webp) + ![Add app details](/images/integrations/gitlab/add-app-details.webp#hero) 8. Set permissions by selecting the required **Scopes**. The table below explains each scope: @@ -124,7 +124,7 @@ Replace `` with your actual Plane instance domain. == GitLab Cloud {#gitlab-cloud} 1. Copy the **Application ID** and **Secret** from the newly created application. - ![Copy credentials](/images/integrations/gitlab/copy-credentials.webp) + ![Copy credentials](/images/integrations/gitlab/copy-credentials.webp#hero) 2. Add these environment variables with the values to your Plane instance's `.env` file. @@ -140,7 +140,7 @@ Replace `` with your actual Plane instance domain. == GitLab Self-managed {#gitlab-self-managed} 1. Copy the **Application ID** and **Secret** from the newly created application. - ![Copy credentials](/images/integrations/gitlab/copy-credentials.webp) + ![Copy credentials](/images/integrations/gitlab/copy-credentials.webp#hero) 2. Once you've created the application, [activate the GitLab Self-managed integration in Plane](https://docs.plane.so/integrations/gitlab?edition=gitlab-self-managed). diff --git a/docs/self-hosting/govern/integrations/slack.md b/docs/self-hosting/govern/integrations/slack.md index 73724161..7909c601 100644 --- a/docs/self-hosting/govern/integrations/slack.md +++ b/docs/self-hosting/govern/integrations/slack.md @@ -26,15 +26,15 @@ To configure Slack integration, you'll need to create a Slack App within your or 1. Go to [Your Apps](https://api.slack.com/apps) on Slack. 2. Click **Create an App**. - ![Create Slack App](/images/integrations/slack/create-slack-app.webp) + ![Create Slack App](/images/integrations/slack/create-slack-app.webp#hero) 3. Choose **From a manifest**. - ![Choose Manifest](/images/integrations/slack/choose-from-manifest.webp) + ![Choose Manifest](/images/integrations/slack/choose-from-manifest.webp#hero) 4. Select the workspace where you want the app installed. 5. Remove the default manifest and paste the one below, making sure to update the placeholders with your actual values. - ![Manifest](/images/integrations/slack/app-from-manifest.webp) + ![Manifest](/images/integrations/slack/app-from-manifest.webp#hero) :::tabs key:manifest-file @@ -205,7 +205,7 @@ event_subscriptions: ::: 6. Review the permissions and click **Create**. - ![Review summary](/images/integrations/slack/review-summary.webp) + ![Review summary](/images/integrations/slack/review-summary.webp#hero) ### Manifest reference @@ -282,7 +282,7 @@ After creating your Slack app, follow these steps: 1. Go to the **Event Subscriptions** tab. 2. Click **Retry** to verify your event subscription URL. - ![Event subscriptions](/images/integrations/slack/event-subscriptions.webp) + ![Event subscriptions](/images/integrations/slack/event-subscriptions.webp#hero) 3. Navigate to the **Basic Information** tab on Slack to find your `client_id` and `client_secret`. diff --git a/docs/self-hosting/govern/ldap.md b/docs/self-hosting/govern/ldap.md index ba64cf9e..18010442 100644 --- a/docs/self-hosting/govern/ldap.md +++ b/docs/self-hosting/govern/ldap.md @@ -21,11 +21,11 @@ You'll need: ## Configure LDAP authentication 1. Sign in to your Plane instance in [God Mode](/self-hosting/govern/instance-admin). - ![Turn on LDAP](/images/ldap/enable-ldap.webp) + ![Turn on LDAP](/images/ldap/enable-ldap.webp#hero) 2. Select **Authentication** from the left pane. 3. Click **Configure** next to **LDAP** at the bottom of the page. 4. Enter your LDAP server details. - ![LDAP configuration](/images/ldap/ldap-configuration.webp) + ![LDAP configuration](/images/ldap/ldap-configuration.webp#hero) - **Server URI (required)** This is the address of your LDAP server. Include the protocol and port number. @@ -137,7 +137,7 @@ You'll need: 5. Click **Save changes** to apply your LDAP settings. Plane will validate the connection to your LDAP server. 6. Users will see **Sign in with LDAP** on Plane's login page and can use their directory credentials to sign in. - ![Sign in using LDAP](/images/ldap/sign-in-ldap.webp) + ![Sign in using LDAP](/images/ldap/sign-in-ldap.webp#hero) ## How LDAP authentication works diff --git a/docs/self-hosting/govern/oidc-sso.md b/docs/self-hosting/govern/oidc-sso.md index 94e2a777..924d9881 100644 --- a/docs/self-hosting/govern/oidc-sso.md +++ b/docs/self-hosting/govern/oidc-sso.md @@ -58,6 +58,6 @@ Your IdP will generate some of the following configs for you. Others, you will s To test if this URL is right, see if clicking the `Login with ` button brings up your IdP's authentication screen. - ![Login with Okta](/images/custom-sso/okta-signin.webp) + ![Login with Okta](/images/custom-sso/okta-signin.webp#hero) - Finally, choose a name for your IdP on Plane so you can recognize this set of configs. diff --git a/docs/self-hosting/govern/saml-sso.md b/docs/self-hosting/govern/saml-sso.md index 577a6b98..e599ed91 100644 --- a/docs/self-hosting/govern/saml-sso.md +++ b/docs/self-hosting/govern/saml-sso.md @@ -68,7 +68,7 @@ You will find all of the values for the fields below in the `/metadata` endpoint This will bring up the IdP's authentication screen for your users. - ![SSO URL](/images/custom-sso/okta-signin.webp) + ![SSO URL](/images/custom-sso/okta-signin.webp#hero) - Copy the `SLS URL` for the Plane client or app from your IdP and paste it in the `Logout URL` field on Plane's `/god-mode/authentication/saml/`. diff --git a/docs/self-hosting/manage/manage-instance-users.md b/docs/self-hosting/manage/manage-instance-users.md new file mode 100644 index 00000000..c88fbd21 --- /dev/null +++ b/docs/self-hosting/manage/manage-instance-users.md @@ -0,0 +1,61 @@ +--- +title: User management +description: Manage instance users, invite instance admins, and control access to God Mode. +--- + +# Manage instance users + +User management lets instance admins view all users across the instance and manage their access. This is separate from workspace-level member management. + +## View users + +Go to **God Mode → User Management** to see all users in the instance. + +![User management](/images/instance-admin/user-management.webp#hero) + +The table displays: + +| Column | Description | +|--------|-------------| +| Full Name | User's full name | +| Display Name | User's display name | +| Email | User's email address | +| Account Type | User or Instance Admin | +| Status | Active or Suspended | +| Joining Date | When the user joined | + +Use the search bar to find specific users. + +## Invite an instance admin + +Instance admins have access to God Mode but are not automatically added to any workspace. + +1. Click **Invite members**. +2. Enter the user's email and password. +3. Optionally enable: + - **Generate random password** — auto-create a password + - **Prompt user to change password after onboarding** — require password reset on first login +4. Click **Invite**. + +![Invite instance admin](/images/instance-admin/invite-instance-admin.webp#hero) + +:::warning +No invitation email is sent. You must share the credentials with the user manually. +::: + +## Manage user access + +Click **…** next to any user to: + +- **Grant admin access** — promote a user to Instance Admin. +- **Remove admin access** — downgrade an Instance Admin to a regular user (loses God Mode access). +- **Remove** — remove the user from the instance entirely. + +![User actions](/images/instance-admin/user-actions.webp#hero) + +## User status + +| Status | Description | +|--------|-------------| +| Active | User can access the instance | +| Suspended | User account exists but cannot access the instance | \ No newline at end of file diff --git a/docs/self-hosting/manage/manage-licenses/activate-airgapped-enterprise.md b/docs/self-hosting/manage/manage-licenses/activate-airgapped-enterprise.md index dca5ff31..45608380 100644 --- a/docs/self-hosting/manage/manage-licenses/activate-airgapped-enterprise.md +++ b/docs/self-hosting/manage/manage-licenses/activate-airgapped-enterprise.md @@ -11,9 +11,9 @@ Once your air-gapped installation is running, you'll need to activate your works 1. Login to the [Prime portal](https://prime.plane.so/licenses) with the same email address you used to purchase the paid plan. 2. Go to [Manage licenses](https://prime.plane.so/licenses). 3. Click **Download license** to download the license file for your Plane version. - ![Download license file](/images/activate-license/download-license.webp) + ![Download license file](/images/activate-license/download-license.webp#hero) 4. Sign in to your Plane instance in [God Mode](/self-hosting/govern/instance-admin). 5. Select **Billing** from the left pane. 6. Upload the license file to activate your instance. - ![Upload license file](/images/activate-license/upload-airgapped-enterprise.webp) + ![Upload license file](/images/activate-license/upload-airgapped-enterprise.webp#hero) 7. Click **Activate**. diff --git a/docs/self-hosting/manage/manage-licenses/activate-airgapped.md b/docs/self-hosting/manage/manage-licenses/activate-airgapped.md index aed410d9..8d4f6423 100644 --- a/docs/self-hosting/manage/manage-licenses/activate-airgapped.md +++ b/docs/self-hosting/manage/manage-licenses/activate-airgapped.md @@ -11,11 +11,11 @@ Once your air-gapped installation is running, you'll need to activate your works 1. Login to the [Prime portal](https://prime.plane.so/licenses) with the same email address you used to purchase the paid plan. 2. Go to [Manage licenses](https://prime.plane.so/licenses). 3. Click **Download license** to download the license file for your Plane version. - ![Download license file](/images/activate-license/download-license.webp) + ![Download license file](/images/activate-license/download-license.webp#hero) 4. Navigate to the [Workspace Settings](https://docs.plane.so/core-concepts/workspaces/overview#workspace-settings) in the Plane application. 5. Select **Billing and plans** on the right pane. 6. Click the **Activate this workspace** button. - ![Upload license file](/images/activate-license/upload-airgapped-license-file.webp) + ![Upload license file](/images/activate-license/upload-airgapped-license-file.webp#hero) 7. Upload the license file to activate your workspace. You now have Plane running in your air-gapped environment. If you run into any issues, check the logs, or reach out to our support team for assistance. diff --git a/docs/self-hosting/manage/manage-licenses/activate-enterprise.md b/docs/self-hosting/manage/manage-licenses/activate-enterprise.md index 617c571c..faab3016 100644 --- a/docs/self-hosting/manage/manage-licenses/activate-enterprise.md +++ b/docs/self-hosting/manage/manage-licenses/activate-enterprise.md @@ -18,6 +18,6 @@ Enterprise plan licenses are activated at the instance level through God Mode, n 6. Paste your license key in the **Activate Enterprise license** field. 7. Click **Activate**. - ![Activate Enterprise license](/images/activate-license/activate-enterprise-plan.webp) + ![Activate Enterprise license](/images/activate-license/activate-enterprise-plan.webp#hero) Once activated, Enterprise features become available across all workspaces on your instance. diff --git a/docs/self-hosting/manage/upgrade-plane.md b/docs/self-hosting/manage/upgrade-plane.md index 7ce73cba..b045e526 100644 --- a/docs/self-hosting/manage/upgrade-plane.md +++ b/docs/self-hosting/manage/upgrade-plane.md @@ -20,7 +20,7 @@ We recommend creating a backup of your data before any version updates. See [Bac You can quickly check your Plane version by clicking the **?** icon on the sidebar. -![Check version number](https://media.docs.plane.so/product/check-version.webp#center) +![Check version number](https://media.docs.plane.so/product/check-version.webp#hero#center) ## Update version diff --git a/docs/self-hosting/manage/view-logs.md b/docs/self-hosting/manage/view-logs.md index a7d40501..2a53c9ac 100644 --- a/docs/self-hosting/manage/view-logs.md +++ b/docs/self-hosting/manage/view-logs.md @@ -16,7 +16,7 @@ sudo prime-cli monitor This brings up a table where you can select which container logs you want to view. -![Container logs](/images/view-logs/container-logs.webp) +![Container logs](/images/view-logs/container-logs.webp#hero) ::: warning **Prime CLI is for Docker installations only.** These commands only work on Plane instances originally installed using `prime-cli`. diff --git a/docs/self-hosting/methods/airgapped-requirements.md b/docs/self-hosting/methods/airgapped-requirements.md index 5f415ce8..9649e926 100644 --- a/docs/self-hosting/methods/airgapped-requirements.md +++ b/docs/self-hosting/methods/airgapped-requirements.md @@ -22,7 +22,7 @@ Plane supports fully airgapped deployments where all components - application se Here's how Plane operates in an airgapped environment with internal enterprise applications: -![Airgapped cluster architecture](/images/airgapped/airgapped-cluster.webp) +![Airgapped cluster architecture](/images/airgapped/airgapped-cluster.webp#hero) This diagram illustrates a critical principle: **all OAuth flows and API communication remain internal to the airgapped cluster**. When integrating with self-hosted GitHub Enterprise, GitLab, or other internal services, the entire authentication and data exchange happens within your isolated network — no internet access required. diff --git a/docs/self-hosting/plane-architecture.md b/docs/self-hosting/plane-architecture.md index 93ac69f7..0c70d855 100644 --- a/docs/self-hosting/plane-architecture.md +++ b/docs/self-hosting/plane-architecture.md @@ -8,7 +8,7 @@ keywords: plane architecture, plane system design, plane components, plane servi Plane consists of multiple services working together to provide project management capabilities. -![Plane architecture](/images/airgapped/plane-architecture.webp) +![Plane architecture](/images/airgapped/plane-architecture.webp#hero) ### Frontend services diff --git a/docs/self-hosting/telemetry.md b/docs/self-hosting/telemetry.md index 5924d848..a511cb86 100644 --- a/docs/self-hosting/telemetry.md +++ b/docs/self-hosting/telemetry.md @@ -81,5 +81,5 @@ As much as we'd love to understand your usage better, we agree that you should b 1. Go to your instance's God Mode by appending `/god-mode` to the domain you have hosted Plane on. 2. In the **General Settings** pane on the right, disable the **Telemetry** toggle button. - ![Disable telemetry](/images/disable-telemetry.webp) + ![Disable telemetry](/images/disable-telemetry.webp#hero) 3. Click **Save changes**. diff --git a/package.json b/package.json index 8764f215..315db29e 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,8 @@ "vue": "^3.5.26" }, "dependencies": { - "lucide-vue-next": "^0.562.0" + "lucide-vue-next": "^0.562.0", + "medium-zoom": "^1.1.0" }, "pnpm": { "overrides": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8c73106b..d64de9be 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -16,6 +16,9 @@ importers: lucide-vue-next: specifier: ^0.562.0 version: 0.562.0(vue@3.5.27) + medium-zoom: + specifier: ^1.1.0 + version: 1.1.0 devDependencies: '@tailwindcss/postcss': specifier: ^4.1.18 @@ -1288,6 +1291,9 @@ packages: mdast-util-to-hast@13.2.1: resolution: {integrity: sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==} + medium-zoom@1.1.0: + resolution: {integrity: sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==} + mermaid@11.12.2: resolution: {integrity: sha512-n34QPDPEKmaeCG4WDMGy0OT6PSyxKCfy2pJgShP+Qow2KLrvWjclwbc3yXfSIf4BanqWEhQEpngWwNp/XhZt6w==} @@ -2773,6 +2779,8 @@ snapshots: unist-util-visit: 5.1.0 vfile: 6.0.3 + medium-zoom@1.1.0: {} + mermaid@11.12.2: dependencies: '@braintree/sanitize-url': 7.1.1