feat(demo): remove demo mode EE-6769 (#11841)

app/portainer/components/demo-feature-indicator/demo-feature-indicator.controller.js

@@ -1,16 +0,0 @@
-class DemoFeatureIndicatorController {
-  /* @ngInject */
-  constructor(StateManager) {
-    Object.assign(this, { StateManager });
-
-    this.isDemo = false;
-  }
-
-  $onInit() {
-    const state = this.StateManager.getState();
-
-    this.isDemo = state.application.demoEnvironment.enabled;
-  }
-}
-
-export default DemoFeatureIndicatorController;

app/portainer/components/demo-feature-indicator/demo-feature-indicator.html

@@ -1,10 +0,0 @@
-<div class="row" ng-if="$ctrl.isDemo">
-  <div class="col-lg-12 col-md-12 col-xs-12">
-    <rd-widget>
-      <rd-widget-header icon="alert-triangle" title-text="Feature not available"> </rd-widget-header>
-      <rd-widget-body>
-        <span class="small text-muted">{{ $ctrl.content }}</span>
-      </rd-widget-body>
-    </rd-widget>
-  </div>
-</div>

app/portainer/components/demo-feature-indicator/index.js

@@ -1,12 +0,0 @@
-import angular from 'angular';
-import controller from './demo-feature-indicator.controller.js';
-
-export const demoFeatureIndicator = {
-  templateUrl: './demo-feature-indicator.html',
-  controller,
-  bindings: {
-    content: '<',
-  },
-};
-
-angular.module('portainer.app').component('demoFeatureIndicator', demoFeatureIndicator);

app/portainer/components/theme/theme-settings.controller.js

@@ -30,10 +30,8 @@ export default class ThemeSettingsController {
 
   async updateThemeSettings(theme) {
     try {
-      if (!this.state.isDemo) {
-        await this.UserService.updateUserTheme(this.state.userId, theme);
-        await queryClient.invalidateQueries(userQueryKeys.user(this.state.userId));
-      }
+      await this.UserService.updateUserTheme(this.state.userId, theme);
+      await queryClient.invalidateQueries(userQueryKeys.user(this.state.userId));
 
       notifySuccess('Success', 'User theme settings successfully updated');
     } catch (err) {
@@ -43,12 +41,9 @@ export default class ThemeSettingsController {
 
   $onInit() {
     return this.$async(async () => {
-      const state = this.StateManager.getState();
-
       this.state = {
         userId: null,
         themeColor: 'auto',
-        isDemo: state.application.demoEnvironment.enabled,
       };
 
       this.state.availableThemes = options;

app/portainer/models/status.js

@@ -4,7 +4,6 @@ export function StatusViewModel(data) {
   this.Version = data.Version;
   this.Edition = data.Edition;
   this.InstanceID = data.InstanceID;
-  this.DemoEnvironment = data.DemoEnvironment;
 }
 
 export function StatusVersionViewModel(data) {

app/portainer/services/stateManager.js

@@ -109,7 +109,6 @@ function StateManagerFactory(
     state.application.version = status.Version;
     state.application.edition = status.Edition;
     state.application.instanceId = status.InstanceID;
-    state.application.demoEnvironment = status.DemoEnvironment;
 
     state.application.enableTelemetry = settings.EnableTelemetry;
     state.application.logo = settings.LogoURL;

app/portainer/views/account/account.html

@@ -1,7 +1,5 @@
 <page-header title="'User settings'" breadcrumbs="['User settings']" reload="true"> </page-header>
 
-<demo-feature-indicator ng-if="isDemoUser" content="'You cannot change the password of this account in the demo version of Portainer.'"> </demo-feature-indicator>
-
 <div class="row">
   <div class="col-lg-12 col-md-12 col-xs-12">
     <theme-settings></theme-settings>
@@ -56,7 +54,7 @@
               <button
                 type="submit"
                 class="btn btn-primary btn-sm"
-                ng-disabled="isDemoUser || (AuthenticationMethod !== 1 && !isInitialAdmin) || !formValues.currentPassword || !formValues.newPassword || form.$invalid || formValues.newPassword !== formValues.confirmPassword"
+                ng-disabled="(AuthenticationMethod !== 1 && !isInitialAdmin) || !formValues.currentPassword || !formValues.newPassword || form.$invalid || formValues.newPassword !== formValues.confirmPassword"
                 ng-click="updatePassword()"
               >
                 Update password

app/portainer/views/account/accountController.js

@@ -76,10 +76,6 @@ angular.module('portainer.app').controller('AccountController', [
       $scope.forceChangePassword = userDetails.forceChangePassword;
       $scope.isInitialAdmin = userDetails.ID === 1;
 
-      if (state.application.demoEnvironment.enabled) {
-        $scope.isDemoUser = state.application.demoEnvironment.users.includes($scope.userID);
-      }
-
       SettingsService.publicSettings()
         .then(function success(data) {
           $scope.AuthenticationMethod = data.AuthenticationMethod;

app/react/portainer/settings/SettingsView/ApplicationSettingsPanel/DemoAlert.tsx

@@ -1,16 +0,0 @@
-import { useIsDemo } from '@/react/portainer/system/useSystemStatus';
-
-export function DemoAlert() {
-  const isDemoQuery = useIsDemo();
-  if (!isDemoQuery.data) {
-    return null;
-  }
-
-  return (
-    <div className="col-sm-12 mt-2">
-      <span className="small text-muted">
-        You cannot use this feature in the demo version of Portainer.
-      </span>
-    </div>
-  );
-}

app/react/portainer/settings/SettingsView/ApplicationSettingsPanel/EnableTelemetryField.tsx

@@ -1,13 +1,8 @@
 import { useField } from 'formik';
 
-import { useIsDemo } from '@/react/portainer/system/useSystemStatus';
-
 import { SwitchField } from '@@/form-components/SwitchField';
 
-import { DemoAlert } from './DemoAlert';
-
 export function EnableTelemetryField() {
-  const isDemoQuery = useIsDemo();
   const [{ value }, , { setValue }] = useField<boolean>('enableTelemetry');
 
   return (
@@ -20,12 +15,9 @@ export function EnableTelemetryField() {
           checked={value}
           name="toggle_enableTelemetry"
           onChange={(checked) => setValue(checked)}
-          disabled={isDemoQuery.data}
         />
       </div>
 
-      <DemoAlert />
-
       <div className="col-sm-12 text-muted small mt-2">
         You can find more information about this in our{' '}
         <a

app/react/portainer/settings/SettingsView/ApplicationSettingsPanel/LogoFieldset.tsx

@@ -1,18 +1,13 @@
 import { useField, Field } from 'formik';
 
-import { useIsDemo } from '@/react/portainer/system/useSystemStatus';
-
 import { FormControl } from '@@/form-components/FormControl';
 import { Input } from '@@/form-components/Input';
 import { SwitchField } from '@@/form-components/SwitchField';
 
 import { useToggledValue } from '../useToggledValue';
 
-import { DemoAlert } from './DemoAlert';
-
 export function LogoFieldset() {
   const [{ name }, { error }] = useField<string>('logo');
-  const isDemoQuery = useIsDemo();
 
   const [isEnabled, setIsEnabled] = useToggledValue('logo');
 
@@ -26,12 +21,9 @@ export function LogoFieldset() {
             checked={isEnabled}
             name="toggle_logo"
             labelClass="col-sm-3 col-lg-2"
-            disabled={isDemoQuery.data}
             onChange={(checked) => setIsEnabled(checked)}
           />
         </div>
-
-        <DemoAlert />
       </div>
 
       {isEnabled && (

app/react/portainer/settings/SettingsView/ApplicationSettingsPanel/ScreenBannerFieldset.tsx

@@ -1,7 +1,6 @@
 import { useField, Field } from 'formik';
 
 import { FeatureId } from '@/react/portainer/feature-flags/enums';
-import { useIsDemo } from '@/react/portainer/system/useSystemStatus';
 
 import { FormControl } from '@@/form-components/FormControl';
 import { TextArea } from '@@/form-components/Input/Textarea';
@@ -9,10 +8,7 @@ import { SwitchField } from '@@/form-components/SwitchField';
 
 import { useToggledValue } from '../useToggledValue';
 
-import { DemoAlert } from './DemoAlert';
-
 export function ScreenBannerFieldset() {
-  const isDemoQuery = useIsDemo();
   const [{ name }, { error }] = useField<string>('loginBanner');
   const [isEnabled, setIsEnabled] = useToggledValue('loginBanner');
 
@@ -26,14 +22,11 @@ export function ScreenBannerFieldset() {
             label="Login screen banner"
             checked={isEnabled}
             name="toggle_login_banner"
-            disabled={isDemoQuery.data}
             onChange={(checked) => setIsEnabled(checked)}
             featureId={FeatureId.CUSTOM_LOGIN_BANNER}
           />
         </div>
 
-        <DemoAlert />
-
         <div className="col-sm-12 text-muted small mt-2">
           You can set a custom banner that will be shown to all users during
           login.

app/react/portainer/system/useSystemStatus.ts

@@ -1,10 +1,8 @@
 import { UseQueryOptions, useQuery } from '@tanstack/react-query';
 
 import axios, { parseAxiosError } from '@/portainer/services/axios';
-import { UserId } from '@/portainer/users/types';
 
 import { isBE } from '../feature-flags/feature-flags.service';
-import { EnvironmentId } from '../environments/types';
 
 import { buildUrl } from './build-url';
 import { queryKeys } from './query-keys';
@@ -15,11 +13,6 @@ export interface StatusResponse {
   Edition: string;
   Version: string;
   InstanceID: string;
-  DemoEnvironment: {
-    Enabled: boolean;
-    Users: Array<UserId>;
-    Environments: Array<EnvironmentId>;
-  };
 }
 
 export async function getSystemStatus() {
@@ -53,9 +46,3 @@ export function useSystemStatus<T = StatusResponse>({
     onSuccess,
   });
 }
-
-export function useIsDemo() {
-  return useSystemStatus({
-    select: (status) => status.DemoEnvironment.Enabled,
-  });
-}