From 02623f005f3e4b3b0021df943243022bb066cef2 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 10:35:40 +0100
Subject: [PATCH 01/23] console: Add fleet options to gateway claiming form

---
 pkg/webui/components/form/field/index.js      | 15 +++-
 .../gateway-claim-form-section/index.js       | 69 +++++++++++++++----
 2 files changed, 67 insertions(+), 17 deletions(-)

diff --git a/pkg/webui/components/form/field/index.js b/pkg/webui/components/form/field/index.js
index 897449efbe..b6e920d5eb 100644
--- a/pkg/webui/components/form/field/index.js
+++ b/pkg/webui/components/form/field/index.js
@@ -77,6 +77,7 @@ const FormField = props => {
     component: Component,
     decode,
     description,
+    descriptionValues,
     disabled: inputDisabled,
     encode,
     fieldWidth,
@@ -92,6 +93,7 @@ const FormField = props => {
     valueSetter,
     onChange,
     onBlur,
+    showTitle,
   } = props
 
   const {
@@ -222,7 +224,12 @@ const FormField = props => {
       <FieldError content={warning} title={title} warning id={describedBy} />
     </div>
   ) : showDescription ? (
-    <Message className={style.description} content={description} id={describedBy} />
+    <Message
+      className={style.description}
+      content={description}
+      values={descriptionValues}
+      id={describedBy}
+    />
   ) : null
 
   const fieldComponentProps = {
@@ -253,7 +260,7 @@ const FormField = props => {
 
   return (
     <div className={cls} data-needs-focus={showError} data-test-id="form-field">
-      {hasTitle && (
+      {hasTitle && showTitle && (
         <div className={style.label}>
           <Message
             component="label"
@@ -290,6 +297,7 @@ FormField.propTypes = {
   ]).isRequired,
   decode: PropTypes.func,
   description: PropTypes.message,
+  descriptionValues: PropTypes.shape({}),
   disabled: PropTypes.bool,
   encode: PropTypes.func,
   fieldWidth: PropTypes.oneOf([
@@ -310,6 +318,7 @@ FormField.propTypes = {
   onChange: PropTypes.func,
   readOnly: PropTypes.bool,
   required: PropTypes.bool,
+  showTitle: PropTypes.bool,
   title: PropTypes.message,
   titleChildren: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
   tooltip: PropTypes.message,
@@ -337,6 +346,8 @@ FormField.defaultProps = {
   validate: undefined,
   valueSetter: defaultValueSetter,
   warning: '',
+  descriptionValues: {},
+  showTitle: true,
 }
 
 export default FormField
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index bc1723e9c9..e47db67c6e 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import React, { useEffect } from 'react'
+import React, { useCallback, useEffect } from 'react'
 import { defineMessages } from 'react-intl'
 import { useFormikContext } from 'formik'
 
@@ -24,6 +24,10 @@ import Notification from '@ttn-lw/components/notification'
 import SubmitBar from '@ttn-lw/components/submit-bar'
 import FormSubmit from '@ttn-lw/components/form/submit'
 import SubmitButton from '@ttn-lw/components/submit-button'
+import Link from '@ttn-lw/components/link'
+import Tabs from '@ttn-lw/components/tabs'
+
+import Message from '@ttn-lw/lib/components/message'
 
 import { GsFrequencyPlansSelect as FrequencyPlansSelect } from '@console/containers/freq-plans-select'
 
@@ -36,7 +40,10 @@ const { enabled: gsEnabled, base_url: gsBaseURL } = selectGsConfig()
 
 const m = defineMessages({
   claimWarning:
-    'We detected that your gateway is a <strong>Managed Gateway</strong>. To claim this gateway, please use the owner token printed on the inside of the mounting lid or scan the QR code to claim instantly.',
+    'We detected a Managed gateway. To claim this gateway, please use the <strong>owner token printed on the gateway</strong>, or the <strong>gateway fleet owner token</strong>.',
+  fleet: 'Fleet',
+  fleetInfo: 'Adding a gateway to a fleet will blablabla.',
+  fleetTokenInfo: 'Your fleet token is available in your account.',
 })
 
 const initialValues = {
@@ -49,10 +56,23 @@ const initialValues = {
   target_gateway_server_address: gsEnabled ? getHostFromUrl(gsBaseURL) : '',
 }
 
+const ownerTokenTypes = [
+  { name: 'gateway', title: sharedMessages.gateway },
+  { name: 'fleet', title: m.fleet },
+]
+
 const GatewayClaimFormSection = () => {
   const { values, addToFieldRegistry, removeFromFieldRegistry } = useFormikContext()
   const isManaged = values._inputMethod === 'managed'
-  const withQRdata = values._withQRdata
+  const isFleet = values._isFleet
+
+  const [activeOwnerTokenType, setActiveOwnerTokenType] = React.useState(
+    isFleet ? 'fleet' : 'gateway',
+  )
+
+  const onOwnerTokenTypeChange = useCallback(value => {
+    setActiveOwnerTokenType(value)
+  }, [])
 
   // Register hidden fields so they don't get cleaned.
   useEffect(() => {
@@ -64,27 +84,46 @@ const GatewayClaimFormSection = () => {
   return (
     <>
       {isManaged && (
-        <Form.InfoField>
-          <Notification
+        <>
+          <Form.InfoField>
+            <Notification
+              small
+              info
+              content={m.claimWarning}
+              messageValues={{
+                strong: txt => <strong>{txt}</strong>,
+              }}
+              className="mb-0"
+            />
+          </Form.InfoField>
+          <Message content={sharedMessages.ownerToken} className="fw-bold" />
+          <Tabs
+            active={activeOwnerTokenType}
+            tabs={ownerTokenTypes}
+            onTabChange={onOwnerTokenTypeChange}
+            toggleStyle
             small
-            info
-            content={m.claimWarning}
-            messageValues={{
-              strong: txt => <strong>{txt}</strong>,
-            }}
-            className="mb-0"
+            className="w-content p-0 mb-cs-xs mt-cs-xxs border-none br-m gap-0 fs-s"
           />
-        </Form.InfoField>
+          {activeOwnerTokenType === 'fleet' && (
+            <Message
+              content={m.fleetInfo}
+              className="mb-cs-xs c-text-neutral-light"
+              component="div"
+            />
+          )}
+        </>
       )}
       <Form.Field
         required
         title={sharedMessages.ownerToken}
+        showTitle={false}
         name="authenticated_identifiers.authentication_code"
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
-        encode={btoa}
-        decode={atob}
-        disabled={withQRdata}
+        description={activeOwnerTokenType === 'fleet' ? m.fleetTokenInfo : undefined}
+        encode={!isFleet ? btoa : undefined}
+        decode={!isFleet ? atob : undefined}
         sensitive
         autoFocus
       />

From e09e712b64cbd1634af5fefb1bbc195d3d38e1b7 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 10:47:29 +0100
Subject: [PATCH 02/23] console: Add fleets to qr code modal

---
 pkg/webui/components/qr-modal-button/index.js | 81 ++++++++++++++++++-
 pkg/webui/components/tabs/index.js            |  4 +
 pkg/webui/components/tabs/tab/index.js        |  4 +
 pkg/webui/components/tabs/tab/tab.styl        |  4 +
 .../gateway-claim-form-section/index.js       |  6 +-
 .../validation-schema.js                      |  1 +
 .../qr-scan-section/index.js                  | 12 ++-
 pkg/webui/lib/shared-messages.js              |  2 +
 8 files changed, 106 insertions(+), 8 deletions(-)

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index 6904ad0388..28b73f5079 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -15,9 +15,11 @@
 import React, { useCallback } from 'react'
 import { defineMessages } from 'react-intl'
 
-import { IconCamera } from '@ttn-lw/components/icon'
+import { IconCamera, IconPlus } from '@ttn-lw/components/icon'
 import Link from '@ttn-lw/components/link'
 import ModalButton from '@ttn-lw/components/button/modal-button'
+import Button from '@ttn-lw/components/button'
+import Input from '@ttn-lw/components/input'
 
 import Message from '@ttn-lw/lib/components/message'
 import ErrorMessage from '@ttn-lw/lib/components/error-message'
@@ -37,10 +39,38 @@ const QrScanDoc = (
 const m = defineMessages({
   scanContinue: 'Please scan the QR code to continue. {qrScanDoc}',
   apply: 'Apply',
+  fleetToken: 'Fleet token',
+  addFleet: 'Add Fleet',
 })
 
 const QRModalButton = props => {
-  const { message, onApprove, onCancel, onRead, qrData, invalidMessage } = props
+  const { message, onApprove, onCancel, onRead, qrData, setQrData, invalidMessage } = props
+  const [isAddFleet, setIsAddFleet] = React.useState(undefined)
+  const [fleetToken, setFleetToken] = React.useState('')
+
+  const handleAddFleet = useCallback(() => {
+    setIsAddFleet(true)
+  }, [])
+
+  const handleRemoveFleet = useCallback(() => {
+    setIsAddFleet(false)
+    setFleetToken('')
+    setQrData({
+      ...qrData,
+      gateway: { ...qrData.gateway, _fleet_token: undefined },
+    })
+  }, [qrData, setQrData])
+
+  const handleFleetTokenChange = useCallback(
+    value => {
+      setFleetToken(value)
+      setQrData({
+        ...qrData,
+        gateway: { ...qrData.gateway, _fleet_token: value },
+      })
+    },
+    [qrData, setQrData],
+  )
 
   const handleRead = useCallback(
     val => {
@@ -53,7 +83,47 @@ const QRModalButton = props => {
     <div style={{ width: '100%' }}>
       {qrData.data ? (
         qrData.valid ? (
-          <DataSheet data={qrData.data} />
+          <>
+            <DataSheet data={qrData.data} />
+            {qrData.gateway.is_managed && (
+              <>
+                {isAddFleet ? (
+                  <div className="w-full mt-cs-xs">
+                    <div className="d-flex j-between">
+                      <Message content={m.fleetToken} className="fw-bold" />
+                      <Button naked message={sharedMessages.remove} onClick={handleRemoveFleet} />
+                    </div>
+                    <Message
+                      content={sharedMessages.fleetInfo}
+                      className="mb-cs-xs c-text-neutral-light"
+                      component="div"
+                    />
+                    <Input
+                      type="code"
+                      sensitive
+                      className="w-full"
+                      inputWidth="full"
+                      value={fleetToken}
+                      onChange={handleFleetTokenChange}
+                    />
+                    <Message
+                      content={sharedMessages.fleetTokenInfo}
+                      className="mb-cs-xs c-text-neutral-light"
+                      component="div"
+                    />
+                  </div>
+                ) : (
+                  <Button
+                    tertiary
+                    message={m.addFleet}
+                    icon={IconPlus}
+                    onClick={handleAddFleet}
+                    className="mt-cs-xs"
+                  />
+                )}
+              </>
+            )}
+          </>
         ) : (
           <ErrorMessage content={invalidMessage} />
         )
@@ -103,7 +173,12 @@ QRModalButton.propTypes = {
   qrData: PropTypes.shape({
     valid: PropTypes.bool,
     data: PropTypes.arrayOf(PropTypes.shape()),
+    gateway: PropTypes.shape({
+      is_managed: PropTypes.bool,
+      _fleet_token: PropTypes.string,
+    }),
   }),
+  setQrData: PropTypes.func.isRequired,
 }
 
 QRModalButton.defaultProps = {
diff --git a/pkg/webui/components/tabs/index.js b/pkg/webui/components/tabs/index.js
index 40352ed86d..a302d06e66 100644
--- a/pkg/webui/components/tabs/index.js
+++ b/pkg/webui/components/tabs/index.js
@@ -36,6 +36,7 @@ const Tabs = ({
   narrow,
   toggleStyle,
   disabled,
+  small,
 }) => {
   const handleClick = tabName => {
     if (!disabled && onTabChange) {
@@ -67,6 +68,7 @@ const Tabs = ({
               className={tabItemClassName}
               toggleStyle={toggleStyle}
               tooltip={description}
+              small={small}
             >
               {icon && <Icon icon={icon} className={style.icon} />}
               <Message content={title} />
@@ -92,6 +94,7 @@ Tabs.propTypes = {
   narrow: PropTypes.bool,
   /** A list of tabs. */
   onTabChange: PropTypes.func,
+  small: PropTypes.bool,
   tabItemClassName: PropTypes.string,
   tabs: PropTypes.arrayOf(
     PropTypes.shape({
@@ -115,6 +118,7 @@ Tabs.defaultProps = {
   narrow: false,
   toggleStyle: false,
   disabled: false,
+  small: false,
 }
 
 export default Tabs
diff --git a/pkg/webui/components/tabs/tab/index.js b/pkg/webui/components/tabs/tab/index.js
index 9b475548eb..34a222df58 100644
--- a/pkg/webui/components/tabs/tab/index.js
+++ b/pkg/webui/components/tabs/tab/index.js
@@ -38,6 +38,7 @@ const Tab = props => {
     tabClassName,
     toggleStyle,
     tooltip,
+    small,
     ...rest
   } = props
 
@@ -56,6 +57,7 @@ const Tab = props => {
     [style.tabItemDisabled]: disabled,
     [style.tabItemToggleStyle]: toggleStyle,
     [style.tabItemToggleStyleActive]: toggleStyle && !disabled && active,
+    [style.small]: small,
   })
 
   // There is no support for disabled on anchors in html and hence in
@@ -113,6 +115,7 @@ Tab.propTypes = {
    * name of the new active tab as an argument.
    */
   onClick: PropTypes.func,
+  small: PropTypes.bool,
   tabClassName: PropTypes.string,
   /** A flag specifying whether the tab should render a toggle style. */
   toggleStyle: PropTypes.bool,
@@ -132,6 +135,7 @@ Tab.defaultProps = {
   exact: true,
   toggleStyle: false,
   tooltip: undefined,
+  small: false,
 }
 
 export default Tab
diff --git a/pkg/webui/components/tabs/tab/tab.styl b/pkg/webui/components/tabs/tab/tab.styl
index bd26b83f95..90e4a41e9c 100644
--- a/pkg/webui/components/tabs/tab/tab.styl
+++ b/pkg/webui/components/tabs/tab/tab.styl
@@ -68,3 +68,7 @@
   &-active
     pseudo-border(3px, var(--c-text-brand-normal))
     color: var(--c-text-neutral-heavy)
+
+  &.small
+    height: 29px
+    font-weight: $fw.bold
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index e47db67c6e..abb8778157 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -42,8 +42,6 @@ const m = defineMessages({
   claimWarning:
     'We detected a Managed gateway. To claim this gateway, please use the <strong>owner token printed on the gateway</strong>, or the <strong>gateway fleet owner token</strong>.',
   fleet: 'Fleet',
-  fleetInfo: 'Adding a gateway to a fleet will blablabla.',
-  fleetTokenInfo: 'Your fleet token is available in your account.',
 })
 
 const initialValues = {
@@ -107,7 +105,7 @@ const GatewayClaimFormSection = () => {
           />
           {activeOwnerTokenType === 'fleet' && (
             <Message
-              content={m.fleetInfo}
+              content={sharedMessages.fleetInfo}
               className="mb-cs-xs c-text-neutral-light"
               component="div"
             />
@@ -121,7 +119,7 @@ const GatewayClaimFormSection = () => {
         name="authenticated_identifiers.authentication_code"
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
-        description={activeOwnerTokenType === 'fleet' ? m.fleetTokenInfo : undefined}
+        description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
         encode={!isFleet ? btoa : undefined}
         decode={!isFleet ? atob : undefined}
         sensitive
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/validation-schema.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/validation-schema.js
index 5b158d970d..57752a5fcf 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/validation-schema.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/validation-schema.js
@@ -19,6 +19,7 @@ import registerValidationSchema from './gateway-registration-form-section/valida
 
 export const validationSchema = Yup.object({
   _owner_id: Yup.string(),
+  _isFleet: Yup.boolean(),
 }).when('._inputMethod', {
   is: 'register',
   then: schema => schema.concat(registerValidationSchema),
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index 64c02bed9f..19a91b4093 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -29,6 +29,7 @@ import sharedMessages from '@ttn-lw/lib/shared-messages'
 
 // TODO: Get the correct sdk (gateway qr code generator)
 import { parseGatewayQRCode } from '@console/store/actions/qr-code-generator'
+import { getGatewayClaimInfoByEui } from '@console/store/actions/gateways'
 
 const m = defineMessages({
   hasGatewayQR:
@@ -67,8 +68,13 @@ const GatewayQRScanSection = () => {
       },
       authenticated_identifiers: {
         gateway_eui: gateway.gateway_eui,
-        authentication_code: gateway.owner_token ? btoa(gateway.owner_token) : '',
+        authentication_code: gateway._fleet_token
+          ? gateway._fleet_token
+          : gateway.owner_token
+            ? btoa(gateway.owner_token)
+            : '',
       },
+      _isFleet: Boolean(gateway._fleet_token),
     }))
 
     setQrData({ ...qrData, approved: true })
@@ -83,6 +89,9 @@ const GatewayQRScanSection = () => {
       try {
         // Get gateway from QR code
         const gateway = await dispatch(attachPromise(parseGatewayQRCode(qrCode)))
+        const gatewayEui = gateway.gateway_eui
+        const { is_managed } = await dispatch(attachPromise(getGatewayClaimInfoByEui(gatewayEui)))
+        gateway.is_managed = is_managed
 
         const sheetData = [
           {
@@ -153,6 +162,7 @@ const GatewayQRScanSection = () => {
             onCancel={handleQRCodeCancel}
             onRead={handleQRCodeRead}
             qrData={qrData}
+            setQrData={setQrData}
           />
         )}
       </ButtonGroup>
diff --git a/pkg/webui/lib/shared-messages.js b/pkg/webui/lib/shared-messages.js
index 6cfeaa6983..67cc70faa9 100644
--- a/pkg/webui/lib/shared-messages.js
+++ b/pkg/webui/lib/shared-messages.js
@@ -278,6 +278,8 @@ export default defineMessages({
   fCnt: 'FCnt',
   fetching: 'Fetching data…',
   firmwareVersion: 'Firmware version',
+  fleetInfo: 'Adding a gateway to a fleet will blablabla.',
+  fleetTokenInfo: 'Your fleet token is available in your account.',
   format: 'Format',
   fpNotFoundError:
     'The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.',

From 97c29579257e9141f866bc9855ea1b87cf42ac4a Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 10:51:25 +0100
Subject: [PATCH 03/23] console: Update messages

---
 pkg/webui/locales/en.json | 4 ++++
 pkg/webui/locales/ja.json | 4 ++++
 2 files changed, 8 insertions(+)

diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 2479647307..aed5244a9d 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -62,6 +62,8 @@
   "components.progress-bar.index.percentage": "{percentage, number, percent} finished",
   "components.qr-modal-button.index.scanContinue": "Please scan the QR code to continue. {qrScanDoc}",
   "components.qr-modal-button.index.apply": "Apply",
+  "components.qr-modal-button.index.fleetToken": "Fleet token",
+  "components.qr-modal-button.index.addFleet": "Add Fleet",
   "components.qr.input.capture.index.uploadImage": "Upload a Photo",
   "components.qr.input.capture.index.qrCodeNotFound": "QR code not found",
   "components.qr.input.video.index.fetchingCamera": "Waiting for camera…",
@@ -1438,6 +1440,8 @@
   "lib.shared-messages.fCnt": "FCnt",
   "lib.shared-messages.fetching": "Fetching data…",
   "lib.shared-messages.firmwareVersion": "Firmware version",
+  "lib.shared-messages.fleetInfo": "Adding a gateway to a fleet will blablabla.",
+  "lib.shared-messages.fleetTokenInfo": "Your fleet token is available in your account.",
   "lib.shared-messages.format": "Format",
   "lib.shared-messages.fpNotFoundError": "The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.",
   "lib.shared-messages.fPort": "FPort",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index 0f1b266e50..a54d0ec362 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -62,6 +62,8 @@
   "components.progress-bar.index.percentage": "{percentage}%　終了",
   "components.qr-modal-button.index.scanContinue": "続けるにはQRコードを読み取ってください{qrScanDoc}",
   "components.qr-modal-button.index.apply": "適用",
+  "components.qr-modal-button.index.fleetToken": "",
+  "components.qr-modal-button.index.addFleet": "",
   "components.qr.input.capture.index.uploadImage": "写真をアップロード",
   "components.qr.input.capture.index.qrCodeNotFound": "QRコードが見つかりません",
   "components.qr.input.video.index.fetchingCamera": "",
@@ -1438,6 +1440,8 @@
   "lib.shared-messages.fCnt": "",
   "lib.shared-messages.fetching": "データの取得...",
   "lib.shared-messages.firmwareVersion": "ファームウェアバージョン",
+  "lib.shared-messages.fleetInfo": "",
+  "lib.shared-messages.fleetTokenInfo": "",
   "lib.shared-messages.format": "フォーマット",
   "lib.shared-messages.fpNotFoundError": "指定された周波数プランは見つかりませんでした",
   "lib.shared-messages.fPort": "",

From ecf5d8620ea0d7d7c13801b2b271b21feabf89c7 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 11:08:05 +0100
Subject: [PATCH 04/23] console: Fix styles

---
 pkg/webui/components/qr-modal-button/index.js | 12 +++++++----
 .../qr-scan-section/index.js                  |  1 +
 pkg/webui/lib/shared-messages.js              |  2 +-
 pkg/webui/locales/en.json                     |  5 +++--
 pkg/webui/locales/ja.json                     |  1 +
 pkg/webui/styles/utilities/general.styl       | 21 +++++++++++++++++++
 6 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index 28b73f5079..14e1414c85 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -90,12 +90,16 @@ const QRModalButton = props => {
                 {isAddFleet ? (
                   <div className="w-full mt-cs-xs">
                     <div className="d-flex j-between">
-                      <Message content={m.fleetToken} className="fw-bold" />
-                      <Button naked message={sharedMessages.remove} onClick={handleRemoveFleet} />
+                      <Message content={m.fleetToken} className="c-text-neutral-semilight" />
+                      <Button
+                        message={sharedMessages.remove}
+                        onClick={handleRemoveFleet}
+                        className="c-text-neutral-light fw-bold hover-underline"
+                      />
                     </div>
                     <Message
                       content={sharedMessages.fleetInfo}
-                      className="mb-cs-xs c-text-neutral-light"
+                      className="mb-cs-xs mt-cs-xxs c-text-neutral-light fs-s"
                       component="div"
                     />
                     <Input
@@ -108,7 +112,7 @@ const QRModalButton = props => {
                     />
                     <Message
                       content={sharedMessages.fleetTokenInfo}
-                      className="mb-cs-xs c-text-neutral-light"
+                      className="mt-cs-xs c-text-neutral-light fs-s"
                       component="div"
                     />
                   </div>
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index 19a91b4093..22090dc0e5 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -74,6 +74,7 @@ const GatewayQRScanSection = () => {
             ? btoa(gateway.owner_token)
             : '',
       },
+      _fleet_token: gateway._fleet_token,
       _isFleet: Boolean(gateway._fleet_token),
     }))
 
diff --git a/pkg/webui/lib/shared-messages.js b/pkg/webui/lib/shared-messages.js
index 67cc70faa9..7b96ea12b0 100644
--- a/pkg/webui/lib/shared-messages.js
+++ b/pkg/webui/lib/shared-messages.js
@@ -509,7 +509,7 @@ export default defineMessages({
   resetConfirm:
     'Are you sure you want to discard QR code data? The scanned device will not be registered and the form will be reset.',
   scanSuccess: 'QR code scanned successfully',
-  scanGatewayQR: 'Scan gateway QR code',
+  scanGatewayQR: 'Gateway QR code',
   redirecting: 'Redirecting…',
   refresh: 'Refresh',
   reactivateSuccess: 'Successfully reactivated',
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index aed5244a9d..de92045201 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -616,7 +616,8 @@
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteSuccess": "WiFi profile deleted",
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteFail": "There was an error and the WiFi profile could not be deleted",
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteModalMessage": "The profile will not be applicable to gateways anymore and gateways using this profile might lose connectivity. Please make sure to update the gateway settings before deleting this profile.",
-  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.claimWarning": "We detected that your gateway is a <strong>Managed Gateway</strong>. To claim this gateway, please use the owner token printed on the inside of the mounting lid or scan the QR code to claim instantly.",
+  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.claimWarning": "We detected a Managed gateway. To claim this gateway, please use the <strong>owner token printed on the gateway</strong>, or the <strong>gateway fleet owner token</strong>.",
+  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.fleet": "Fleet",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.requireAuthenticatedConnectionDescription": "Select which information can be seen by other network participants, including {packetBrokerURL}",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.shareGatewayInfoDescription": "Choose this option eg. if your gateway is powered by {loraBasicStationURL}",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.validation-schema.validateEntry": "There must be at least one selected frequency plan ID.",
@@ -1657,7 +1658,7 @@
   "lib.shared-messages.qrCodeDataReset": "Reset QR code data",
   "lib.shared-messages.resetConfirm": "Are you sure you want to discard QR code data? The scanned device will not be registered and the form will be reset.",
   "lib.shared-messages.scanSuccess": "QR code scanned successfully",
-  "lib.shared-messages.scanGatewayQR": "Scan gateway QR code",
+  "lib.shared-messages.scanGatewayQR": "Gateway QR code",
   "lib.shared-messages.redirecting": "Redirecting…",
   "lib.shared-messages.refresh": "Refresh",
   "lib.shared-messages.reactivateSuccess": "Successfully reactivated",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index a54d0ec362..fd3b94dcaf 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -617,6 +617,7 @@
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteFail": "",
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteModalMessage": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.claimWarning": "",
+  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.fleet": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.requireAuthenticatedConnectionDescription": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.shareGatewayInfoDescription": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.validation-schema.validateEntry": "",
diff --git a/pkg/webui/styles/utilities/general.styl b/pkg/webui/styles/utilities/general.styl
index dce6c9ff27..2f8edc5d13 100644
--- a/pkg/webui/styles/utilities/general.styl
+++ b/pkg/webui/styles/utilities/general.styl
@@ -165,6 +165,12 @@
   .h-vh
     height: 100vh !important
 
+  .h-l
+    height: $cs.l !important
+
+  .h-content
+    height: fit-content !important
+
   for $num in (1..9)
     $percentage = percentage($num / 10)
     .w-{$num}0
@@ -474,3 +480,18 @@
 
   .border-regular
     border: 1px solid var(--c-border-neutral-light) !important
+
+  .no-wrap
+    white-space: nowrap !important
+
+  .flex-basis-1
+    flex-basis: 1rem !important
+
+  .hover-underline:hover
+    text-decoration: underline !important
+
+  // Responsive flex-basis.
+  for $name, $width in $bp
+    +media-query($width)
+      .{$name}\\:flex-basis-1
+        flex-basis: 1rem !important

From 2fe05d0994b016bfc54d49510d169945480683dc Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 12:09:13 +0100
Subject: [PATCH 05/23] console: Fix toggle

---
 .../gateway-claim-form-section/index.js       | 22 ++++++++++++++-----
 .../qr-scan-section/index.js                  |  3 ++-
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index abb8778157..30e0416a76 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -60,7 +60,7 @@ const ownerTokenTypes = [
 ]
 
 const GatewayClaimFormSection = () => {
-  const { values, addToFieldRegistry, removeFromFieldRegistry } = useFormikContext()
+  const { values, addToFieldRegistry, removeFromFieldRegistry, setFieldValue } = useFormikContext()
   const isManaged = values._inputMethod === 'managed'
   const isFleet = values._isFleet
 
@@ -68,10 +68,22 @@ const GatewayClaimFormSection = () => {
     isFleet ? 'fleet' : 'gateway',
   )
 
-  const onOwnerTokenTypeChange = useCallback(value => {
-    setActiveOwnerTokenType(value)
-  }, [])
-
+  const onOwnerTokenTypeChange = useCallback(
+    value => {
+      console.log('values', values)
+      setActiveOwnerTokenType(value)
+      if (value === 'fleet') {
+        setFieldValue('authenticated_identifiers.authentication_code', values._fleet_token || '')
+      } else {
+        setFieldValue(
+          'authenticated_identifiers.authentication_code',
+          values._owner_token ? values._owner_token : '',
+        )
+      }
+    },
+    [setFieldValue, values],
+  )
+  console.log('values', values)
   // Register hidden fields so they don't get cleaned.
   useEffect(() => {
     const hiddenFields = ['target_gateway_server_address']
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index 22090dc0e5..fc9cd7f52a 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -58,7 +58,7 @@ const GatewayQRScanSection = () => {
 
   const handleQRCodeApprove = useCallback(() => {
     const { gateway } = qrData
-
+    console.log('gateway from qr', gateway.owner_token)
     setValues(values => ({
       ...values,
       _withQRdata: true,
@@ -74,6 +74,7 @@ const GatewayQRScanSection = () => {
             ? btoa(gateway.owner_token)
             : '',
       },
+      _owner_token: gateway.owner_token ? btoa(gateway.owner_token) : '',
       _fleet_token: gateway._fleet_token,
       _isFleet: Boolean(gateway._fleet_token),
     }))

From 06167a877d8f08019744e2b36774523dc81d1684 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 12:27:50 +0100
Subject: [PATCH 06/23] console: FIx authentication identifiers encoding

---
 .../gateway-claim-form-section/index.js       | 31 ++++++++++---------
 .../qr-scan-section/index.js                  |  7 ++---
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index 30e0416a76..55e1001093 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -60,7 +60,7 @@ const ownerTokenTypes = [
 ]
 
 const GatewayClaimFormSection = () => {
-  const { values, addToFieldRegistry, removeFromFieldRegistry, setFieldValue } = useFormikContext()
+  const { values, addToFieldRegistry, removeFromFieldRegistry, setValues } = useFormikContext()
   const isManaged = values._inputMethod === 'managed'
   const isFleet = values._isFleet
 
@@ -70,20 +70,23 @@ const GatewayClaimFormSection = () => {
 
   const onOwnerTokenTypeChange = useCallback(
     value => {
-      console.log('values', values)
       setActiveOwnerTokenType(value)
-      if (value === 'fleet') {
-        setFieldValue('authenticated_identifiers.authentication_code', values._fleet_token || '')
-      } else {
-        setFieldValue(
-          'authenticated_identifiers.authentication_code',
-          values._owner_token ? values._owner_token : '',
-        )
-      }
+      setValues(values => ({
+        ...values,
+        authenticated_identifiers: {
+          ...values.authenticated_identifiers,
+          authentication_code:
+            value === 'fleet'
+              ? btoa(values._fleet_token)
+              : value === 'gateway'
+                ? btoa(values._owner_token)
+                : '',
+        },
+      }))
     },
-    [setFieldValue, values],
+    [setValues],
   )
-  console.log('values', values)
+
   // Register hidden fields so they don't get cleaned.
   useEffect(() => {
     const hiddenFields = ['target_gateway_server_address']
@@ -132,8 +135,8 @@ const GatewayClaimFormSection = () => {
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
         description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
-        encode={!isFleet ? btoa : undefined}
-        decode={!isFleet ? atob : undefined}
+        encode={btoa}
+        decode={atob}
         sensitive
         autoFocus
       />
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index fc9cd7f52a..f391acb75a 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -58,7 +58,6 @@ const GatewayQRScanSection = () => {
 
   const handleQRCodeApprove = useCallback(() => {
     const { gateway } = qrData
-    console.log('gateway from qr', gateway.owner_token)
     setValues(values => ({
       ...values,
       _withQRdata: true,
@@ -69,13 +68,13 @@ const GatewayQRScanSection = () => {
       authenticated_identifiers: {
         gateway_eui: gateway.gateway_eui,
         authentication_code: gateway._fleet_token
-          ? gateway._fleet_token
+          ? btoa(gateway._fleet_token)
           : gateway.owner_token
             ? btoa(gateway.owner_token)
             : '',
       },
-      _owner_token: gateway.owner_token ? btoa(gateway.owner_token) : '',
-      _fleet_token: gateway._fleet_token,
+      _owner_token: gateway.owner_token ?? '',
+      _fleet_token: gateway._fleet_token ?? '',
       _isFleet: Boolean(gateway._fleet_token),
     }))
 

From aa4430900603d1d18df8060a6e385a5b793617f5 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 13:33:25 +0100
Subject: [PATCH 07/23] console: Fix fleet token logic

---
 pkg/webui/components/qr-modal-button/index.js | 33 ++++++++++---------
 .../gateway-claim-form-section/index.js       |  8 ++---
 .../qr-scan-section/index.js                  | 23 ++++++-------
 3 files changed, 34 insertions(+), 30 deletions(-)

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index 14e1414c85..b0925fb0d2 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -39,34 +39,36 @@ const QrScanDoc = (
 const m = defineMessages({
   scanContinue: 'Please scan the QR code to continue. {qrScanDoc}',
   apply: 'Apply',
-  fleetToken: 'Fleet token',
-  addFleet: 'Add Fleet',
+  fleetToken: 'Fleet owner token',
+  addFleet: 'Add to Fleet',
+  addToFleetTooltip:
+    'You are registering a Managed gateway. If you want to add it to an existing fleet, click here.',
 })
 
 const QRModalButton = props => {
   const { message, onApprove, onCancel, onRead, qrData, setQrData, invalidMessage } = props
-  const [isAddFleet, setIsAddFleet] = React.useState(undefined)
-  const [fleetToken, setFleetToken] = React.useState('')
+  const [isAddToFleet, setIsAddToFleet] = React.useState(undefined)
+  const [fleetOwnerToken, setFleetOwnerToken] = React.useState('')
 
-  const handleAddFleet = useCallback(() => {
-    setIsAddFleet(true)
+  const handleAddToFleet = useCallback(() => {
+    setIsAddToFleet(true)
   }, [])
 
   const handleRemoveFleet = useCallback(() => {
-    setIsAddFleet(false)
-    setFleetToken('')
+    setIsAddToFleet(false)
+    setFleetOwnerToken('')
     setQrData({
       ...qrData,
-      gateway: { ...qrData.gateway, _fleet_token: undefined },
+      gateway: { ...qrData.gateway, _fleet_owner_token: undefined },
     })
   }, [qrData, setQrData])
 
   const handleFleetTokenChange = useCallback(
     value => {
-      setFleetToken(value)
+      setFleetOwnerToken(value)
       setQrData({
         ...qrData,
-        gateway: { ...qrData.gateway, _fleet_token: value },
+        gateway: { ...qrData.gateway, _fleet_owner_token: value },
       })
     },
     [qrData, setQrData],
@@ -87,7 +89,7 @@ const QRModalButton = props => {
             <DataSheet data={qrData.data} />
             {qrData.gateway.is_managed && (
               <>
-                {isAddFleet ? (
+                {isAddToFleet ? (
                   <div className="w-full mt-cs-xs">
                     <div className="d-flex j-between">
                       <Message content={m.fleetToken} className="c-text-neutral-semilight" />
@@ -107,7 +109,7 @@ const QRModalButton = props => {
                       sensitive
                       className="w-full"
                       inputWidth="full"
-                      value={fleetToken}
+                      value={fleetOwnerToken}
                       onChange={handleFleetTokenChange}
                     />
                     <Message
@@ -121,8 +123,10 @@ const QRModalButton = props => {
                     tertiary
                     message={m.addFleet}
                     icon={IconPlus}
-                    onClick={handleAddFleet}
+                    onClick={handleAddToFleet}
                     className="mt-cs-xs"
+                    tooltip={m.addToFleetTooltip}
+                    tooltipPlacement="bottom"
                   />
                 )}
               </>
@@ -179,7 +183,6 @@ QRModalButton.propTypes = {
     data: PropTypes.arrayOf(PropTypes.shape()),
     gateway: PropTypes.shape({
       is_managed: PropTypes.bool,
-      _fleet_token: PropTypes.string,
     }),
   }),
   setQrData: PropTypes.func.isRequired,
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index 55e1001093..a72220a248 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -76,10 +76,10 @@ const GatewayClaimFormSection = () => {
         authenticated_identifiers: {
           ...values.authenticated_identifiers,
           authentication_code:
-            value === 'fleet'
-              ? btoa(values._fleet_token)
-              : value === 'gateway'
-                ? btoa(values._owner_token)
+            value === 'fleet' && values._fleet_owner_token
+              ? btoa(values._fleet_owner_token)
+              : value === 'gateway' && values._gtw_owner_token
+                ? btoa(values._gtw_owner_token)
                 : '',
         },
       }))
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index f391acb75a..f0a7c77c41 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -37,6 +37,7 @@ const m = defineMessages({
   gatewayGuide: 'Gateway registration help',
   invalidQRCode:
     'Invalid QR code data. Please note that only TTIGPRO1 Gateway Identification QR Code can be scanned. Some gateways have unrelated QR codes printed on them that cannot be used.',
+  gatewayOwnerToken: 'Gateway owner token',
 })
 
 const qrDataInitialState = {
@@ -67,15 +68,15 @@ const GatewayQRScanSection = () => {
       },
       authenticated_identifiers: {
         gateway_eui: gateway.gateway_eui,
-        authentication_code: gateway._fleet_token
-          ? btoa(gateway._fleet_token)
+        authentication_code: gateway._fleet_owner_token
+          ? btoa(gateway._fleet_owner_token)
           : gateway.owner_token
             ? btoa(gateway.owner_token)
             : '',
       },
-      _owner_token: gateway.owner_token ?? '',
-      _fleet_token: gateway._fleet_token ?? '',
-      _isFleet: Boolean(gateway._fleet_token),
+      _gtw_owner_token: gateway.owner_token ?? '',
+      _fleet_owner_token: gateway._fleet_owner_token ?? '',
+      _isFleet: Boolean(gateway._fleet_owner_token),
     }))
 
     setQrData({ ...qrData, approved: true })
@@ -98,18 +99,18 @@ const GatewayQRScanSection = () => {
           {
             header: sharedMessages.qrCodeData,
             items: [
-              {
-                key: sharedMessages.ownerToken,
-                value: gateway.owner_token,
-                type: 'code',
-                sensitive: true,
-              },
               {
                 key: sharedMessages.gatewayEUI,
                 value: gateway.gateway_eui,
                 type: 'byte',
                 sensitive: false,
               },
+              {
+                key: m.gatewayOwnerToken,
+                value: gateway.owner_token,
+                type: 'code',
+                sensitive: true,
+              },
             ],
           },
         ]

From aacb9d2b5c17990d8f52825c4b44f8a2fd9ccb9d Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 13:57:21 +0100
Subject: [PATCH 08/23] console: Fix error message

---
 pkg/webui/lib/errors/utils.js |  5 +----
 pkg/webui/locales/en.json     | 11 ++++++++---
 pkg/webui/locales/ja.json     |  5 +++++
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/pkg/webui/lib/errors/utils.js b/pkg/webui/lib/errors/utils.js
index a292fad5c1..4fd52a8e30 100644
--- a/pkg/webui/lib/errors/utils.js
+++ b/pkg/webui/lib/errors/utils.js
@@ -602,7 +602,7 @@ export const getClaimGatewayErrorMessage = error => {
   const m = defineMessages({
     notFound: "Gateway doesn't exist. Please confirm that the gateway EUI is correct.",
     subscriptionNotActive:
-      'There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation and try again.',
+      'There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a <link>Fleet Owner Token</link> during the registration process.',
     activationCodeExpired:
       'The activation code has expired. To reactivate it, extend your <link>Gateway Subscription</link>.',
     permissionDenied: 'The owner token is invalid.',
@@ -618,9 +618,6 @@ export const getClaimGatewayErrorMessage = error => {
       if (backendErrorMessage.includes('gateway subscription not attached and active')) {
         return m.subscriptionNotActive
       }
-      if (backendErrorMessage.includes('activation code expired')) {
-        return m.activationCodeExpired
-      }
       return undefined
     case 7: // PERMISSION_DENIED
       return m.permissionDenied
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index de92045201..24922584d0 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -62,8 +62,9 @@
   "components.progress-bar.index.percentage": "{percentage, number, percent} finished",
   "components.qr-modal-button.index.scanContinue": "Please scan the QR code to continue. {qrScanDoc}",
   "components.qr-modal-button.index.apply": "Apply",
-  "components.qr-modal-button.index.fleetToken": "Fleet token",
-  "components.qr-modal-button.index.addFleet": "Add Fleet",
+  "components.qr-modal-button.index.fleetToken": "Fleet owner token",
+  "components.qr-modal-button.index.addFleet": "Add to Fleet",
+  "components.qr-modal-button.index.addToFleetTooltip": "You are registering a Managed gateway. If you want to add it to an existing fleet, click here.",
   "components.qr.input.capture.index.uploadImage": "Upload a Photo",
   "components.qr.input.capture.index.qrCodeNotFound": "QR code not found",
   "components.qr.input.video.index.fetchingCamera": "Waiting for camera…",
@@ -101,6 +102,9 @@
   "console.components.application-general-settings-form.index.adminContactDescription": "Administrative contact information for this application. Typically used to indicate who to contact with administrative questions about the application.",
   "console.components.application-general-settings-form.index.techContactDescription": "Technical contact information for this application. Typically used to indicate who to contact with technical/security questions about the application.",
   "console.components.application-map-panel.index.deviceLocations": "Device locations",
+  "console.components.claim-deprecation-modal.index.modalTitle": "The Claim App has been removed",
+  "console.components.claim-deprecation-modal.index.modalMessage": "The Claim App and in-cluster claiming has been removed in version 3.25.2. You can use the regular device registration flow in the Console, which includes claiming if applicable, or use the claiming feature of the CLI. For more information, please refer to the <Link>Device Claiming</Link> documentation.",
+  "console.components.claim-deprecation-modal.index.buttonMessage": "Close and use Console",
   "console.components.default-routing-policy-form.index.doNotUseADefaultPolicy": "Do not use a default routing policy for this network",
   "console.components.device-import-form.index.file": "File",
   "console.components.device-import-form.index.formatInfo": "Format information",
@@ -627,6 +631,7 @@
   "console.containers.gateway-onboarding-form.qr-scan-section.index.hasGatewayQR": "Does your gateway have a LoRaWAN® Gateway Identification QR Code? Scan it to speed up onboarding.",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayGuide": "Gateway registration help",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.invalidQRCode": "Invalid QR code data. Please note that only TTIGPRO1 Gateway Identification QR Code can be scanned. Some gateways have unrelated QR codes printed on them that cannot be used.",
+  "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayOwnerToken": "Gateway owner token",
   "console.containers.gateway-overview-header.index.addBookmarkFail": "There was an error and the gateway could not be bookmarked",
   "console.containers.gateway-overview-header.index.duplicateGateway": "Duplicate gateway",
   "console.containers.gateway-overview-header.index.removeBookmarkFail": "There was an error and the gateway could not be removed from bookmarks",
@@ -1086,7 +1091,7 @@
   "lib.errors.status-code-messages.503": "Service unavailable",
   "lib.errors.status-code-messages.504": "Gateway timeout",
   "lib.errors.utils.notFound": "Gateway doesn't exist. Please confirm that the gateway EUI is correct.",
-  "lib.errors.utils.subscriptionNotActive": "There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation and try again.",
+  "lib.errors.utils.subscriptionNotActive": "There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a <link>Fleet Owner Token</link> during the registration process.",
   "lib.errors.utils.activationCodeExpired": "The activation code has expired. To reactivate it, extend your <link>Gateway Subscription</link>.",
   "lib.errors.utils.permissionDenied": "The owner token is invalid.",
   "lib.field-description-messages.idLocation": "Enter a value using lowercase letters, numbers, and dashes. You can choose this freely.",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index fd3b94dcaf..7a460171af 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -64,6 +64,7 @@
   "components.qr-modal-button.index.apply": "適用",
   "components.qr-modal-button.index.fleetToken": "",
   "components.qr-modal-button.index.addFleet": "",
+  "components.qr-modal-button.index.addToFleetTooltip": "",
   "components.qr.input.capture.index.uploadImage": "写真をアップロード",
   "components.qr.input.capture.index.qrCodeNotFound": "QRコードが見つかりません",
   "components.qr.input.video.index.fetchingCamera": "",
@@ -101,6 +102,9 @@
   "console.components.application-general-settings-form.index.adminContactDescription": "このアプリケーションの管理者の連絡先情報。通常、アプリケーションに関する管理上の問い合わせ先を示すために使用されます。",
   "console.components.application-general-settings-form.index.techContactDescription": "このアプリケーションの技術的な連絡先情報。通常、アプリケーションに関する技術/セキュリティの質問の連絡先を示すために使用されます。",
   "console.components.application-map-panel.index.deviceLocations": "",
+  "console.components.claim-deprecation-modal.index.modalTitle": "",
+  "console.components.claim-deprecation-modal.index.modalMessage": "",
+  "console.components.claim-deprecation-modal.index.buttonMessage": "",
   "console.components.default-routing-policy-form.index.doNotUseADefaultPolicy": "このネットワークでは、デフォルトのルーティングポリシーを使用しないでください",
   "console.components.device-import-form.index.file": "",
   "console.components.device-import-form.index.formatInfo": "",
@@ -627,6 +631,7 @@
   "console.containers.gateway-onboarding-form.qr-scan-section.index.hasGatewayQR": "",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayGuide": "",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.invalidQRCode": "",
+  "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayOwnerToken": "",
   "console.containers.gateway-overview-header.index.addBookmarkFail": "",
   "console.containers.gateway-overview-header.index.duplicateGateway": "",
   "console.containers.gateway-overview-header.index.removeBookmarkFail": "",

From 4c541d08139b6d9d1a8157cadfc1faa44a90d3af Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 14:03:32 +0100
Subject: [PATCH 09/23] console: Fix e2e tests

---
 cypress/e2e/console/gateways/create.spec.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/cypress/e2e/console/gateways/create.spec.js b/cypress/e2e/console/gateways/create.spec.js
index b1fd349c80..b00762cb6c 100644
--- a/cypress/e2e/console/gateways/create.spec.js
+++ b/cypress/e2e/console/gateways/create.spec.js
@@ -190,7 +190,7 @@ describe('Gateway create', () => {
     cy.findByLabelText('Gateway EUI').type(gateway.eui)
     cy.findByRole('button', { name: 'Confirm' }).click()
     cy.findByTestId('notification').should('be.visible')
-    cy.findByLabelText('Owner token').type('12345')
+    cy.get('input[name="authenticated_identifiers.authentication_code"]').type('12345')
     cy.findByLabelText('Gateway ID').type(`eui-${gateway.eui}`)
     cy.findByText('Frequency plan')
       .parents('div[data-test-id="form-field"]')
@@ -239,7 +239,7 @@ describe('Gateway create', () => {
     cy.findByTestId('notification').should('be.visible')
     cy.findByLabelText('Frequency plan').selectOption(gateway.frequency_plan)
     cy.findByLabelText('Gateway ID').type(`eui-${gateway.eui}`)
-    cy.findByLabelText('Owner token').type('12345')
+    cy.get('input[name="authenticated_identifiers.authentication_code"]').type('12345')
     cy.findByRole('button', { name: 'Claim gateway' }).click()
     cy.wait('@claim-request').its('request.body').should('deep.equal', expectedRequest)
     cy.findByTestId('error-notification').should('not.exist')

From 987e80e0521edf0b37e9ee0cc5a199efb9786c07 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 14:35:41 +0100
Subject: [PATCH 10/23] console: Add correct messages

---
 pkg/webui/components/qr-modal-button/index.js      | 14 ++++++++++++--
 .../gateway-claim-form-section/index.js            | 10 +++++++++-
 pkg/webui/lib/shared-messages.js                   |  4 ++--
 pkg/webui/locales/en.json                          |  4 ++--
 4 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index b0925fb0d2..80d1c0e406 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -26,10 +26,13 @@ import ErrorMessage from '@ttn-lw/lib/components/error-message'
 
 import PropTypes from '@ttn-lw/lib/prop-types'
 import sharedMessages from '@ttn-lw/lib/shared-messages'
+import { selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
 
 import DataSheet from '../data-sheet'
 import QR from '../qr'
 
+const smUrl = selectPluginTTSCloud().subscription_management_url
+
 const QrScanDoc = (
   <Link.Anchor external secondary href="https://www.thethingsindustries.com/docs/">
     Having trouble?
@@ -100,7 +103,14 @@ const QRModalButton = props => {
                       />
                     </div>
                     <Message
-                      content={sharedMessages.fleetInfo}
+                      content={sharedMessages.fleetTokenInfo}
+                      values={{
+                        Link: val => (
+                          <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
+                            {val}
+                          </Link.Anchor>
+                        ),
+                      }}
                       className="mb-cs-xs mt-cs-xxs c-text-neutral-light fs-s"
                       component="div"
                     />
@@ -113,7 +123,7 @@ const QRModalButton = props => {
                       onChange={handleFleetTokenChange}
                     />
                     <Message
-                      content={sharedMessages.fleetTokenInfo}
+                      content={sharedMessages.fleetInfo}
                       className="mt-cs-xs c-text-neutral-light fs-s"
                       component="div"
                     />
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index a72220a248..a15f80c844 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -31,12 +31,13 @@ import Message from '@ttn-lw/lib/components/message'
 
 import { GsFrequencyPlansSelect as FrequencyPlansSelect } from '@console/containers/freq-plans-select'
 
-import { selectGsConfig } from '@ttn-lw/lib/selectors/env'
+import { selectGsConfig, selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
 import sharedMessages from '@ttn-lw/lib/shared-messages'
 import tooltipIds from '@ttn-lw/lib/constants/tooltip-ids'
 import getHostFromUrl from '@ttn-lw/lib/host-from-url'
 
 const { enabled: gsEnabled, base_url: gsBaseURL } = selectGsConfig()
+const smUrl = selectPluginTTSCloud().subscription_management_url
 
 const m = defineMessages({
   claimWarning:
@@ -135,6 +136,13 @@ const GatewayClaimFormSection = () => {
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
         description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
+        descriptionValues={{
+          Link: val => (
+            <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
+              {val}
+            </Link.Anchor>
+          ),
+        }}
         encode={btoa}
         decode={atob}
         sensitive
diff --git a/pkg/webui/lib/shared-messages.js b/pkg/webui/lib/shared-messages.js
index 7b96ea12b0..47e3e3d82d 100644
--- a/pkg/webui/lib/shared-messages.js
+++ b/pkg/webui/lib/shared-messages.js
@@ -278,8 +278,8 @@ export default defineMessages({
   fCnt: 'FCnt',
   fetching: 'Fetching data…',
   firmwareVersion: 'Firmware version',
-  fleetInfo: 'Adding a gateway to a fleet will blablabla.',
-  fleetTokenInfo: 'Your fleet token is available in your account.',
+  fleetInfo: 'Adding a gateway to a Fleet will claim the gateway using an available Slot.',
+  fleetTokenInfo: 'Your fleet token is available in <Link>your account.</Link>',
   format: 'Format',
   fpNotFoundError:
     'The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.',
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 24922584d0..c274b86b4f 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -1446,8 +1446,8 @@
   "lib.shared-messages.fCnt": "FCnt",
   "lib.shared-messages.fetching": "Fetching data…",
   "lib.shared-messages.firmwareVersion": "Firmware version",
-  "lib.shared-messages.fleetInfo": "Adding a gateway to a fleet will blablabla.",
-  "lib.shared-messages.fleetTokenInfo": "Your fleet token is available in your account.",
+  "lib.shared-messages.fleetInfo": "Adding a gateway to a Fleet will claim the gateway using an available Slot.",
+  "lib.shared-messages.fleetTokenInfo": "Your fleet token is available in <Link>your account.</Link>",
   "lib.shared-messages.format": "Format",
   "lib.shared-messages.fpNotFoundError": "The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.",
   "lib.shared-messages.fPort": "FPort",

From af400c113bfc0fa9faad59d7313156e3234f85c4 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 14:56:34 +0100
Subject: [PATCH 11/23] console: Separate tti only parts and gateway fleet only
 parts

---
 pkg/webui/components/qr-modal-button/index.js |  94 +-------------
 .../gateway-claim-form-section/index.js       |  14 ++-
 .../qr-scan-section/fleets-scan.tti.js        | 116 ++++++++++++++++++
 .../qr-scan-section/index.js                  |  10 +-
 pkg/webui/locales/en.json                     |   6 +-
 pkg/webui/locales/ja.json                     |   6 +-
 6 files changed, 149 insertions(+), 97 deletions(-)
 create mode 100644 pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index 80d1c0e406..da31b1f249 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -15,24 +15,19 @@
 import React, { useCallback } from 'react'
 import { defineMessages } from 'react-intl'
 
-import { IconCamera, IconPlus } from '@ttn-lw/components/icon'
+import { IconCamera } from '@ttn-lw/components/icon'
 import Link from '@ttn-lw/components/link'
 import ModalButton from '@ttn-lw/components/button/modal-button'
-import Button from '@ttn-lw/components/button'
-import Input from '@ttn-lw/components/input'
 
 import Message from '@ttn-lw/lib/components/message'
 import ErrorMessage from '@ttn-lw/lib/components/error-message'
 
 import PropTypes from '@ttn-lw/lib/prop-types'
 import sharedMessages from '@ttn-lw/lib/shared-messages'
-import { selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
 
 import DataSheet from '../data-sheet'
 import QR from '../qr'
 
-const smUrl = selectPluginTTSCloud().subscription_management_url
-
 const QrScanDoc = (
   <Link.Anchor external secondary href="https://www.thethingsindustries.com/docs/">
     Having trouble?
@@ -42,40 +37,10 @@ const QrScanDoc = (
 const m = defineMessages({
   scanContinue: 'Please scan the QR code to continue. {qrScanDoc}',
   apply: 'Apply',
-  fleetToken: 'Fleet owner token',
-  addFleet: 'Add to Fleet',
-  addToFleetTooltip:
-    'You are registering a Managed gateway. If you want to add it to an existing fleet, click here.',
 })
 
 const QRModalButton = props => {
-  const { message, onApprove, onCancel, onRead, qrData, setQrData, invalidMessage } = props
-  const [isAddToFleet, setIsAddToFleet] = React.useState(undefined)
-  const [fleetOwnerToken, setFleetOwnerToken] = React.useState('')
-
-  const handleAddToFleet = useCallback(() => {
-    setIsAddToFleet(true)
-  }, [])
-
-  const handleRemoveFleet = useCallback(() => {
-    setIsAddToFleet(false)
-    setFleetOwnerToken('')
-    setQrData({
-      ...qrData,
-      gateway: { ...qrData.gateway, _fleet_owner_token: undefined },
-    })
-  }, [qrData, setQrData])
-
-  const handleFleetTokenChange = useCallback(
-    value => {
-      setFleetOwnerToken(value)
-      setQrData({
-        ...qrData,
-        gateway: { ...qrData.gateway, _fleet_owner_token: value },
-      })
-    },
-    [qrData, setQrData],
-  )
+  const { message, onApprove, onCancel, onRead, qrData, invalidMessage, modalDataChildren } = props
 
   const handleRead = useCallback(
     val => {
@@ -90,57 +55,7 @@ const QRModalButton = props => {
         qrData.valid ? (
           <>
             <DataSheet data={qrData.data} />
-            {qrData.gateway.is_managed && (
-              <>
-                {isAddToFleet ? (
-                  <div className="w-full mt-cs-xs">
-                    <div className="d-flex j-between">
-                      <Message content={m.fleetToken} className="c-text-neutral-semilight" />
-                      <Button
-                        message={sharedMessages.remove}
-                        onClick={handleRemoveFleet}
-                        className="c-text-neutral-light fw-bold hover-underline"
-                      />
-                    </div>
-                    <Message
-                      content={sharedMessages.fleetTokenInfo}
-                      values={{
-                        Link: val => (
-                          <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
-                            {val}
-                          </Link.Anchor>
-                        ),
-                      }}
-                      className="mb-cs-xs mt-cs-xxs c-text-neutral-light fs-s"
-                      component="div"
-                    />
-                    <Input
-                      type="code"
-                      sensitive
-                      className="w-full"
-                      inputWidth="full"
-                      value={fleetOwnerToken}
-                      onChange={handleFleetTokenChange}
-                    />
-                    <Message
-                      content={sharedMessages.fleetInfo}
-                      className="mt-cs-xs c-text-neutral-light fs-s"
-                      component="div"
-                    />
-                  </div>
-                ) : (
-                  <Button
-                    tertiary
-                    message={m.addFleet}
-                    icon={IconPlus}
-                    onClick={handleAddToFleet}
-                    className="mt-cs-xs"
-                    tooltip={m.addToFleetTooltip}
-                    tooltipPlacement="bottom"
-                  />
-                )}
-              </>
-            )}
+            {modalDataChildren}
           </>
         ) : (
           <ErrorMessage content={invalidMessage} />
@@ -185,6 +100,7 @@ const QRModalButton = props => {
 QRModalButton.propTypes = {
   invalidMessage: PropTypes.message.isRequired,
   message: PropTypes.message.isRequired,
+  modalDataChildren: PropTypes.node,
   onApprove: PropTypes.func.isRequired,
   onCancel: PropTypes.func.isRequired,
   onRead: PropTypes.func.isRequired,
@@ -195,11 +111,11 @@ QRModalButton.propTypes = {
       is_managed: PropTypes.bool,
     }),
   }),
-  setQrData: PropTypes.func.isRequired,
 }
 
 QRModalButton.defaultProps = {
   qrData: undefined,
+  modalDataChildren: null,
 }
 
 export default QRModalButton
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index a15f80c844..b28abe5af4 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -37,7 +37,9 @@ import tooltipIds from '@ttn-lw/lib/constants/tooltip-ids'
 import getHostFromUrl from '@ttn-lw/lib/host-from-url'
 
 const { enabled: gsEnabled, base_url: gsBaseURL } = selectGsConfig()
+// TTI only.
 const smUrl = selectPluginTTSCloud().subscription_management_url
+// End TTI.
 
 const m = defineMessages({
   claimWarning:
@@ -55,14 +57,17 @@ const initialValues = {
   target_gateway_server_address: gsEnabled ? getHostFromUrl(gsBaseURL) : '',
 }
 
+// TTI only.
 const ownerTokenTypes = [
   { name: 'gateway', title: sharedMessages.gateway },
   { name: 'fleet', title: m.fleet },
 ]
+// End TTI.
 
 const GatewayClaimFormSection = () => {
   const { values, addToFieldRegistry, removeFromFieldRegistry, setValues } = useFormikContext()
   const isManaged = values._inputMethod === 'managed'
+  // TTI only.
   const isFleet = values._isFleet
 
   const [activeOwnerTokenType, setActiveOwnerTokenType] = React.useState(
@@ -87,6 +92,7 @@ const GatewayClaimFormSection = () => {
     },
     [setValues],
   )
+  // End TTI.
 
   // Register hidden fields so they don't get cleaned.
   useEffect(() => {
@@ -110,6 +116,7 @@ const GatewayClaimFormSection = () => {
               className="mb-0"
             />
           </Form.InfoField>
+          {/** TTI only. */}
           <Message content={sharedMessages.ownerToken} className="fw-bold" />
           <Tabs
             active={activeOwnerTokenType}
@@ -126,15 +133,19 @@ const GatewayClaimFormSection = () => {
               component="div"
             />
           )}
+          {/** End TTI. */}
         </>
       )}
       <Form.Field
         required
         title={sharedMessages.ownerToken}
-        showTitle={false}
+        // TTI only.
+        showTitle={!isManaged}
+        // End TTI.
         name="authenticated_identifiers.authentication_code"
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
+        // TTI only.
         description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
         descriptionValues={{
           Link: val => (
@@ -143,6 +154,7 @@ const GatewayClaimFormSection = () => {
             </Link.Anchor>
           ),
         }}
+        // End TTI.
         encode={btoa}
         decode={atob}
         sensitive
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
new file mode 100644
index 0000000000..d59d425159
--- /dev/null
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
@@ -0,0 +1,116 @@
+// Copyright © 2025 The Things Industries B.V.
+
+import React, { useCallback } from 'react'
+import { defineMessages } from 'react-intl'
+
+import { IconPlus } from '@ttn-lw/components/icon'
+import Link from '@ttn-lw/components/link'
+import Button from '@ttn-lw/components/button'
+import Input from '@ttn-lw/components/input'
+
+import Message from '@ttn-lw/lib/components/message'
+
+import sharedMessages from '@ttn-lw/lib/shared-messages'
+import { selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
+import PropTypes from '@ttn-lw/lib/prop-types'
+
+const smUrl = selectPluginTTSCloud().subscription_management_url
+
+const m = defineMessages({
+  addFleet: 'Add to Fleet',
+  fleetToken: 'Fleet owner token',
+  addToFleetTooltip:
+    'You are registering a Managed gateway. If you want to add it to an existing fleet, click here.',
+})
+
+const FleetsScan = ({ qrData, setQrData }) => {
+  const [isAddToFleet, setIsAddToFleet] = React.useState(undefined)
+  const [fleetOwnerToken, setFleetOwnerToken] = React.useState('')
+
+  const handleAddToFleet = useCallback(() => {
+    setIsAddToFleet(true)
+  }, [])
+
+  const handleRemoveFleet = useCallback(() => {
+    setIsAddToFleet(false)
+    setFleetOwnerToken('')
+    setQrData({
+      ...qrData,
+      gateway: { ...qrData.gateway, _fleet_owner_token: undefined },
+    })
+  }, [qrData, setQrData])
+
+  const handleFleetTokenChange = useCallback(
+    value => {
+      setFleetOwnerToken(value)
+      setQrData({
+        ...qrData,
+        gateway: { ...qrData.gateway, _fleet_owner_token: value },
+      })
+    },
+    [qrData, setQrData],
+  )
+
+  return qrData.gateway.is_managed ? (
+    <>
+      {isAddToFleet ? (
+        <div className="w-full mt-cs-xs">
+          <div className="d-flex j-between">
+            <Message content={m.fleetToken} className="c-text-neutral-semilight" />
+            <Button
+              message={sharedMessages.remove}
+              onClick={handleRemoveFleet}
+              className="c-text-neutral-light fw-bold hover-underline"
+            />
+          </div>
+          <Message
+            content={sharedMessages.fleetTokenInfo}
+            values={{
+              Link: val => (
+                <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
+                  {val}
+                </Link.Anchor>
+              ),
+            }}
+            className="mb-cs-xs mt-cs-xxs c-text-neutral-light fs-s"
+            component="div"
+          />
+          <Input
+            type="code"
+            sensitive
+            className="w-full"
+            inputWidth="full"
+            value={fleetOwnerToken}
+            onChange={handleFleetTokenChange}
+          />
+          <Message
+            content={sharedMessages.fleetInfo}
+            className="mt-cs-xs c-text-neutral-light fs-s"
+            component="div"
+          />
+        </div>
+      ) : (
+        <Button
+          tertiary
+          message={m.addFleet}
+          icon={IconPlus}
+          onClick={handleAddToFleet}
+          className="mt-cs-xs"
+          tooltip={m.addToFleetTooltip}
+          tooltipPlacement="bottom"
+        />
+      )}
+    </>
+  ) : null
+}
+
+FleetsScan.propTypes = {
+  qrData: PropTypes.shape({
+    gateway: PropTypes.shape({
+      is_managed: PropTypes.bool,
+    }),
+  }).isRequired,
+  setQrData: PropTypes.func.isRequired,
+}
+
+export default FleetsScan
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index f0a7c77c41..154113a4f0 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -31,6 +31,8 @@ import sharedMessages from '@ttn-lw/lib/shared-messages'
 import { parseGatewayQRCode } from '@console/store/actions/qr-code-generator'
 import { getGatewayClaimInfoByEui } from '@console/store/actions/gateways'
 
+import FleetsScan from './fleets-scan.tti'
+
 const m = defineMessages({
   hasGatewayQR:
     'Does your gateway have a LoRaWAN® Gateway Identification QR Code? Scan it to speed up onboarding.',
@@ -68,6 +70,7 @@ const GatewayQRScanSection = () => {
       },
       authenticated_identifiers: {
         gateway_eui: gateway.gateway_eui,
+        // TTI only.
         authentication_code: gateway._fleet_owner_token
           ? btoa(gateway._fleet_owner_token)
           : gateway.owner_token
@@ -77,6 +80,7 @@ const GatewayQRScanSection = () => {
       _gtw_owner_token: gateway.owner_token ?? '',
       _fleet_owner_token: gateway._fleet_owner_token ?? '',
       _isFleet: Boolean(gateway._fleet_owner_token),
+      // End TTI.
     }))
 
     setQrData({ ...qrData, approved: true })
@@ -92,8 +96,10 @@ const GatewayQRScanSection = () => {
         // Get gateway from QR code
         const gateway = await dispatch(attachPromise(parseGatewayQRCode(qrCode)))
         const gatewayEui = gateway.gateway_eui
+        // TTI only.
         const { is_managed } = await dispatch(attachPromise(getGatewayClaimInfoByEui(gatewayEui)))
         gateway.is_managed = is_managed
+        // End TTI.
 
         const sheetData = [
           {
@@ -164,7 +170,9 @@ const GatewayQRScanSection = () => {
             onCancel={handleQRCodeCancel}
             onRead={handleQRCodeRead}
             qrData={qrData}
-            setQrData={setQrData}
+            // TTI only.
+            modalDataChildren={<FleetsScan qrData={qrData} setQrData={setQrData} />}
+            // End TTI.
           />
         )}
       </ButtonGroup>
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index c274b86b4f..61839bc073 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -62,9 +62,6 @@
   "components.progress-bar.index.percentage": "{percentage, number, percent} finished",
   "components.qr-modal-button.index.scanContinue": "Please scan the QR code to continue. {qrScanDoc}",
   "components.qr-modal-button.index.apply": "Apply",
-  "components.qr-modal-button.index.fleetToken": "Fleet owner token",
-  "components.qr-modal-button.index.addFleet": "Add to Fleet",
-  "components.qr-modal-button.index.addToFleetTooltip": "You are registering a Managed gateway. If you want to add it to an existing fleet, click here.",
   "components.qr.input.capture.index.uploadImage": "Upload a Photo",
   "components.qr.input.capture.index.qrCodeNotFound": "QR code not found",
   "components.qr.input.video.index.fetchingCamera": "Waiting for camera…",
@@ -628,6 +625,9 @@
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.continue": "To continue, please confirm the Gateway EUI so we can determine onboarding options",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.emtyEui": "Continue without EUI",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.noEui": "No gateway EUI",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.addFleet": "Add to Fleet",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.fleetToken": "Fleet owner token",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.addToFleetTooltip": "You are registering a Managed gateway. If you want to add it to an existing fleet, click here.",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.hasGatewayQR": "Does your gateway have a LoRaWAN® Gateway Identification QR Code? Scan it to speed up onboarding.",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayGuide": "Gateway registration help",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.invalidQRCode": "Invalid QR code data. Please note that only TTIGPRO1 Gateway Identification QR Code can be scanned. Some gateways have unrelated QR codes printed on them that cannot be used.",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index 7a460171af..a460adddff 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -62,9 +62,6 @@
   "components.progress-bar.index.percentage": "{percentage}%　終了",
   "components.qr-modal-button.index.scanContinue": "続けるにはQRコードを読み取ってください{qrScanDoc}",
   "components.qr-modal-button.index.apply": "適用",
-  "components.qr-modal-button.index.fleetToken": "",
-  "components.qr-modal-button.index.addFleet": "",
-  "components.qr-modal-button.index.addToFleetTooltip": "",
   "components.qr.input.capture.index.uploadImage": "写真をアップロード",
   "components.qr.input.capture.index.qrCodeNotFound": "QRコードが見つかりません",
   "components.qr.input.video.index.fetchingCamera": "",
@@ -628,6 +625,9 @@
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.continue": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.emtyEui": "",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.index.noEui": "",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.addFleet": "",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.fleetToken": "",
+  "console.containers.gateway-onboarding-form.qr-scan-section.fleets-scan.addToFleetTooltip": "",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.hasGatewayQR": "",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.gatewayGuide": "",
   "console.containers.gateway-onboarding-form.qr-scan-section.index.invalidQRCode": "",

From 8d11d3d9878eae1c2c1963da67149c967a007fd5 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 17:06:05 +0100
Subject: [PATCH 12/23] console: Fix header

---
 .../qr-scan-section/fleets-scan.tti.js             | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
index d59d425159..007ebf26db 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
@@ -1,4 +1,16 @@
-// Copyright © 2025 The Things Industries B.V.
+// Copyright © 2025 The Things Network Foundation, The Things Industries B.V.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
 
 import React, { useCallback } from 'react'
 import { defineMessages } from 'react-intl'

From fdc36827bfe6ea07e7c2117974858c8396355e99 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 15:29:03 +0100
Subject: [PATCH 13/23] console: Remove unnecessary message

---
 pkg/webui/lib/errors/utils.js | 4 +---
 pkg/webui/locales/en.json     | 3 +--
 pkg/webui/locales/ja.json     | 1 -
 3 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/pkg/webui/lib/errors/utils.js b/pkg/webui/lib/errors/utils.js
index 4fd52a8e30..8c0ebb0510 100644
--- a/pkg/webui/lib/errors/utils.js
+++ b/pkg/webui/lib/errors/utils.js
@@ -602,9 +602,7 @@ export const getClaimGatewayErrorMessage = error => {
   const m = defineMessages({
     notFound: "Gateway doesn't exist. Please confirm that the gateway EUI is correct.",
     subscriptionNotActive:
-      'There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a <link>Fleet Owner Token</link> during the registration process.',
-    activationCodeExpired:
-      'The activation code has expired. To reactivate it, extend your <link>Gateway Subscription</link>.',
+      'There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a Fleet Owner Token during the registration process.',
     permissionDenied: 'The owner token is invalid.',
   })
 
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 61839bc073..285bbb3edc 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -1091,8 +1091,7 @@
   "lib.errors.status-code-messages.503": "Service unavailable",
   "lib.errors.status-code-messages.504": "Gateway timeout",
   "lib.errors.utils.notFound": "Gateway doesn't exist. Please confirm that the gateway EUI is correct.",
-  "lib.errors.utils.subscriptionNotActive": "There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a <link>Fleet Owner Token</link> during the registration process.",
-  "lib.errors.utils.activationCodeExpired": "The activation code has expired. To reactivate it, extend your <link>Gateway Subscription</link>.",
+  "lib.errors.utils.subscriptionNotActive": "There is no gateway subscription attached or active. Please get a <link>Gateway Subscription</link> or activate your subscription following the steps in the documentation. If this gateway is part of a fleet, you should use a Fleet Owner Token during the registration process.",
   "lib.errors.utils.permissionDenied": "The owner token is invalid.",
   "lib.field-description-messages.idLocation": "Enter a value using lowercase letters, numbers, and dashes. You can choose this freely.",
   "lib.field-description-messages.freqPlanDescription": "A frequency plan defines data rates that your end device or gateway is setup to use. It is important that gateways and end devices within reach use the same frequency plan to be able to communicate.",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index a460adddff..f617c11a3e 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -1092,7 +1092,6 @@
   "lib.errors.status-code-messages.504": "",
   "lib.errors.utils.notFound": "",
   "lib.errors.utils.subscriptionNotActive": "",
-  "lib.errors.utils.activationCodeExpired": "",
   "lib.errors.utils.permissionDenied": "",
   "lib.field-description-messages.idLocation": "",
   "lib.field-description-messages.freqPlanDescription": "周波数プランは、エンドデバイスやゲートウェイが使用するように設定されたデータレートを定義します。ゲートウェイとエンドデバイスが通信できるようにするためには、同じ周波数プランを使用することが重要です",

From 6c4e8d112ab980e02105f15f70ddcc2a2c10d187 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 16:39:38 +0100
Subject: [PATCH 14/23] console: Rename file and merge tti parts

---
 .../gateway-claim-form-section/index.js          | 16 ++--------------
 .../{fleets-scan.tti.js => fleets-scan.js}       |  0
 .../qr-scan-section/index.js                     |  8 +-------
 3 files changed, 3 insertions(+), 21 deletions(-)
 rename pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/{fleets-scan.tti.js => fleets-scan.js} (100%)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index b28abe5af4..4f09eca978 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -31,15 +31,13 @@ import Message from '@ttn-lw/lib/components/message'
 
 import { GsFrequencyPlansSelect as FrequencyPlansSelect } from '@console/containers/freq-plans-select'
 
-import { selectGsConfig, selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
+import { selectGsConfig } from '@ttn-lw/lib/selectors/env'
 import sharedMessages from '@ttn-lw/lib/shared-messages'
 import tooltipIds from '@ttn-lw/lib/constants/tooltip-ids'
 import getHostFromUrl from '@ttn-lw/lib/host-from-url'
 
 const { enabled: gsEnabled, base_url: gsBaseURL } = selectGsConfig()
-// TTI only.
-const smUrl = selectPluginTTSCloud().subscription_management_url
-// End TTI.
+const smUrl = 'https://accounts.thethingsindustries.com'
 
 const m = defineMessages({
   claimWarning:
@@ -57,17 +55,14 @@ const initialValues = {
   target_gateway_server_address: gsEnabled ? getHostFromUrl(gsBaseURL) : '',
 }
 
-// TTI only.
 const ownerTokenTypes = [
   { name: 'gateway', title: sharedMessages.gateway },
   { name: 'fleet', title: m.fleet },
 ]
-// End TTI.
 
 const GatewayClaimFormSection = () => {
   const { values, addToFieldRegistry, removeFromFieldRegistry, setValues } = useFormikContext()
   const isManaged = values._inputMethod === 'managed'
-  // TTI only.
   const isFleet = values._isFleet
 
   const [activeOwnerTokenType, setActiveOwnerTokenType] = React.useState(
@@ -92,7 +87,6 @@ const GatewayClaimFormSection = () => {
     },
     [setValues],
   )
-  // End TTI.
 
   // Register hidden fields so they don't get cleaned.
   useEffect(() => {
@@ -116,7 +110,6 @@ const GatewayClaimFormSection = () => {
               className="mb-0"
             />
           </Form.InfoField>
-          {/** TTI only. */}
           <Message content={sharedMessages.ownerToken} className="fw-bold" />
           <Tabs
             active={activeOwnerTokenType}
@@ -133,19 +126,15 @@ const GatewayClaimFormSection = () => {
               component="div"
             />
           )}
-          {/** End TTI. */}
         </>
       )}
       <Form.Field
         required
         title={sharedMessages.ownerToken}
-        // TTI only.
         showTitle={!isManaged}
-        // End TTI.
         name="authenticated_identifiers.authentication_code"
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
-        // TTI only.
         description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
         descriptionValues={{
           Link: val => (
@@ -154,7 +143,6 @@ const GatewayClaimFormSection = () => {
             </Link.Anchor>
           ),
         }}
-        // End TTI.
         encode={btoa}
         decode={atob}
         sensitive
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
similarity index 100%
rename from pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.tti.js
rename to pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
index 154113a4f0..1d2490d6ff 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/index.js
@@ -31,7 +31,7 @@ import sharedMessages from '@ttn-lw/lib/shared-messages'
 import { parseGatewayQRCode } from '@console/store/actions/qr-code-generator'
 import { getGatewayClaimInfoByEui } from '@console/store/actions/gateways'
 
-import FleetsScan from './fleets-scan.tti'
+import FleetsScan from './fleets-scan'
 
 const m = defineMessages({
   hasGatewayQR:
@@ -70,7 +70,6 @@ const GatewayQRScanSection = () => {
       },
       authenticated_identifiers: {
         gateway_eui: gateway.gateway_eui,
-        // TTI only.
         authentication_code: gateway._fleet_owner_token
           ? btoa(gateway._fleet_owner_token)
           : gateway.owner_token
@@ -80,7 +79,6 @@ const GatewayQRScanSection = () => {
       _gtw_owner_token: gateway.owner_token ?? '',
       _fleet_owner_token: gateway._fleet_owner_token ?? '',
       _isFleet: Boolean(gateway._fleet_owner_token),
-      // End TTI.
     }))
 
     setQrData({ ...qrData, approved: true })
@@ -96,10 +94,8 @@ const GatewayQRScanSection = () => {
         // Get gateway from QR code
         const gateway = await dispatch(attachPromise(parseGatewayQRCode(qrCode)))
         const gatewayEui = gateway.gateway_eui
-        // TTI only.
         const { is_managed } = await dispatch(attachPromise(getGatewayClaimInfoByEui(gatewayEui)))
         gateway.is_managed = is_managed
-        // End TTI.
 
         const sheetData = [
           {
@@ -170,9 +166,7 @@ const GatewayQRScanSection = () => {
             onCancel={handleQRCodeCancel}
             onRead={handleQRCodeRead}
             qrData={qrData}
-            // TTI only.
             modalDataChildren={<FleetsScan qrData={qrData} setQrData={setQrData} />}
-            // End TTI.
           />
         )}
       </ButtonGroup>

From 358a13b8bcab98d5bdf84d1be4c187c26531974b Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 17:07:34 +0100
Subject: [PATCH 15/23] console: Fix URL

---
 .../gateway-onboarding-form/qr-scan-section/fleets-scan.js     | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
index 007ebf26db..d9c056528b 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
@@ -23,10 +23,9 @@ import Input from '@ttn-lw/components/input'
 import Message from '@ttn-lw/lib/components/message'
 
 import sharedMessages from '@ttn-lw/lib/shared-messages'
-import { selectPluginTTSCloud } from '@ttn-lw/lib/selectors/env'
 import PropTypes from '@ttn-lw/lib/prop-types'
 
-const smUrl = selectPluginTTSCloud().subscription_management_url
+const smUrl = 'https://accounts.thethingsindustries.com'
 
 const m = defineMessages({
   addFleet: 'Add to Fleet',

From 8b3d1476269157b2de9a27e37986232a33e8fec1 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 17:15:41 +0100
Subject: [PATCH 16/23] console: Fix messages

---
 pkg/webui/locales/en.json | 3 ---
 pkg/webui/locales/ja.json | 3 ---
 2 files changed, 6 deletions(-)

diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 285bbb3edc..52ea0561c4 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -99,9 +99,6 @@
   "console.components.application-general-settings-form.index.adminContactDescription": "Administrative contact information for this application. Typically used to indicate who to contact with administrative questions about the application.",
   "console.components.application-general-settings-form.index.techContactDescription": "Technical contact information for this application. Typically used to indicate who to contact with technical/security questions about the application.",
   "console.components.application-map-panel.index.deviceLocations": "Device locations",
-  "console.components.claim-deprecation-modal.index.modalTitle": "The Claim App has been removed",
-  "console.components.claim-deprecation-modal.index.modalMessage": "The Claim App and in-cluster claiming has been removed in version 3.25.2. You can use the regular device registration flow in the Console, which includes claiming if applicable, or use the claiming feature of the CLI. For more information, please refer to the <Link>Device Claiming</Link> documentation.",
-  "console.components.claim-deprecation-modal.index.buttonMessage": "Close and use Console",
   "console.components.default-routing-policy-form.index.doNotUseADefaultPolicy": "Do not use a default routing policy for this network",
   "console.components.device-import-form.index.file": "File",
   "console.components.device-import-form.index.formatInfo": "Format information",
diff --git a/pkg/webui/locales/ja.json b/pkg/webui/locales/ja.json
index f617c11a3e..dc92705558 100644
--- a/pkg/webui/locales/ja.json
+++ b/pkg/webui/locales/ja.json
@@ -99,9 +99,6 @@
   "console.components.application-general-settings-form.index.adminContactDescription": "このアプリケーションの管理者の連絡先情報。通常、アプリケーションに関する管理上の問い合わせ先を示すために使用されます。",
   "console.components.application-general-settings-form.index.techContactDescription": "このアプリケーションの技術的な連絡先情報。通常、アプリケーションに関する技術/セキュリティの質問の連絡先を示すために使用されます。",
   "console.components.application-map-panel.index.deviceLocations": "",
-  "console.components.claim-deprecation-modal.index.modalTitle": "",
-  "console.components.claim-deprecation-modal.index.modalMessage": "",
-  "console.components.claim-deprecation-modal.index.buttonMessage": "",
   "console.components.default-routing-policy-form.index.doNotUseADefaultPolicy": "このネットワークでは、デフォルトのルーティングポリシーを使用しないでください",
   "console.components.device-import-form.index.file": "",
   "console.components.device-import-form.index.formatInfo": "",

From 84a630756d331bc4084ca9967f0e49871b681feb Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 15:25:51 +0100
Subject: [PATCH 17/23] console: Fix copilot review

---
 pkg/webui/components/qr-modal-button/index.js |  4 +--
 .../qr-scan-section/fleets-scan.js            | 26 ++++++++++---------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/pkg/webui/components/qr-modal-button/index.js b/pkg/webui/components/qr-modal-button/index.js
index da31b1f249..1a6e9fbc2c 100644
--- a/pkg/webui/components/qr-modal-button/index.js
+++ b/pkg/webui/components/qr-modal-button/index.js
@@ -107,9 +107,7 @@ QRModalButton.propTypes = {
   qrData: PropTypes.shape({
     valid: PropTypes.bool,
     data: PropTypes.arrayOf(PropTypes.shape()),
-    gateway: PropTypes.shape({
-      is_managed: PropTypes.bool,
-    }),
+    gateway: PropTypes.shape({}),
   }),
 }
 
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
index d9c056528b..9583007383 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
@@ -35,7 +35,7 @@ const m = defineMessages({
 })
 
 const FleetsScan = ({ qrData, setQrData }) => {
-  const [isAddToFleet, setIsAddToFleet] = React.useState(undefined)
+  const [isAddToFleet, setIsAddToFleet] = React.useState(false)
   const [fleetOwnerToken, setFleetOwnerToken] = React.useState('')
 
   const handleAddToFleet = useCallback(() => {
@@ -45,24 +45,24 @@ const FleetsScan = ({ qrData, setQrData }) => {
   const handleRemoveFleet = useCallback(() => {
     setIsAddToFleet(false)
     setFleetOwnerToken('')
-    setQrData({
-      ...qrData,
-      gateway: { ...qrData.gateway, _fleet_owner_token: undefined },
-    })
-  }, [qrData, setQrData])
+    setQrData(prevQrData => ({
+      ...prevQrData,
+      gateway: { ...prevQrData.gateway, _fleet_owner_token: undefined },
+    }))
+  }, [setQrData])
 
   const handleFleetTokenChange = useCallback(
     value => {
       setFleetOwnerToken(value)
-      setQrData({
-        ...qrData,
-        gateway: { ...qrData.gateway, _fleet_owner_token: value },
-      })
+      setQrData(prevQrData => ({
+        ...prevQrData,
+        gateway: { ...prevQrData.gateway, _fleet_owner_token: value },
+      }))
     },
-    [qrData, setQrData],
+    [setQrData],
   )
 
-  return qrData.gateway.is_managed ? (
+  return qrData?.gateway?.is_managed ? (
     <>
       {isAddToFleet ? (
         <div className="w-full mt-cs-xs">
@@ -119,6 +119,8 @@ FleetsScan.propTypes = {
   qrData: PropTypes.shape({
     gateway: PropTypes.shape({
       is_managed: PropTypes.bool,
+      _fleet_owner_token: PropTypes.string,
+      owner_token: PropTypes.string,
     }),
   }).isRequired,
   setQrData: PropTypes.func.isRequired,

From 0c0af8be02ba90a592bea4711b4593051eacaba7 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Tue, 2 Dec 2025 17:34:37 +0100
Subject: [PATCH 18/23] console: Fix condition

---
 .../gateway-claim-form-section/index.js                       | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index 4f09eca978..f75e175014 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -135,7 +135,9 @@ const GatewayClaimFormSection = () => {
         name="authenticated_identifiers.authentication_code"
         tooltipId={tooltipIds.CLAIM_AUTH_CODE}
         component={Input}
-        description={activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined}
+        description={
+          isManaged && activeOwnerTokenType === 'fleet' ? sharedMessages.fleetTokenInfo : undefined
+        }
         descriptionValues={{
           Link: val => (
             <Link.Anchor secondary href={`${smUrl}/dashboard`} external>

From c695efaa20e9aa0b78fbab5c6d31dbc41161a1a9 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 8 Dec 2025 15:20:23 +0100
Subject: [PATCH 19/23] console: Add slot link

---
 .../gateway-claim-form-section/index.js                | 10 ++++++++++
 .../qr-scan-section/fleets-scan.js                     | 10 ++++++++++
 pkg/webui/lib/shared-messages.js                       |  3 ++-
 pkg/webui/locales/en.json                              |  2 +-
 4 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index f75e175014..d3b85cb164 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -122,6 +122,16 @@ const GatewayClaimFormSection = () => {
           {activeOwnerTokenType === 'fleet' && (
             <Message
               content={sharedMessages.fleetInfo}
+              values={{
+                Link: val => (
+                  <Link.DocLink
+                    secondary
+                    path="/hardware/gateways/models/thethingsindoorgatewaypro/#subscription"
+                  >
+                    {val}
+                  </Link.DocLink>
+                ),
+              }}
               className="mb-cs-xs c-text-neutral-light"
               component="div"
             />
diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
index 9583007383..dbfaf8a837 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
@@ -96,6 +96,16 @@ const FleetsScan = ({ qrData, setQrData }) => {
           />
           <Message
             content={sharedMessages.fleetInfo}
+            values={{
+              Link: val => (
+                <Link.DocLink
+                  secondary
+                  path="/hardware/gateways/models/thethingsindoorgatewaypro/#subscription"
+                >
+                  {val}
+                </Link.DocLink>
+              ),
+            }}
             className="mt-cs-xs c-text-neutral-light fs-s"
             component="div"
           />
diff --git a/pkg/webui/lib/shared-messages.js b/pkg/webui/lib/shared-messages.js
index 47e3e3d82d..17619f1188 100644
--- a/pkg/webui/lib/shared-messages.js
+++ b/pkg/webui/lib/shared-messages.js
@@ -278,7 +278,8 @@ export default defineMessages({
   fCnt: 'FCnt',
   fetching: 'Fetching data…',
   firmwareVersion: 'Firmware version',
-  fleetInfo: 'Adding a gateway to a Fleet will claim the gateway using an available Slot.',
+  fleetInfo:
+    'Adding a gateway to a Fleet will claim the gateway using an <Link>available Slot.</Link>',
   fleetTokenInfo: 'Your fleet token is available in <Link>your account.</Link>',
   format: 'Format',
   fpNotFoundError:
diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 52ea0561c4..890965157d 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -1442,7 +1442,7 @@
   "lib.shared-messages.fCnt": "FCnt",
   "lib.shared-messages.fetching": "Fetching data…",
   "lib.shared-messages.firmwareVersion": "Firmware version",
-  "lib.shared-messages.fleetInfo": "Adding a gateway to a Fleet will claim the gateway using an available Slot.",
+  "lib.shared-messages.fleetInfo": "Adding a gateway to a Fleet will claim the gateway using an <Link>available Slot.</Link>",
   "lib.shared-messages.fleetTokenInfo": "Your fleet token is available in <Link>your account.</Link>",
   "lib.shared-messages.format": "Format",
   "lib.shared-messages.fpNotFoundError": "The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.",

From ff08e042e6010bbe75d6251d6b322d33f0e2d910 Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 8 Dec 2025 16:32:00 +0100
Subject: [PATCH 20/23] console: Add correct links

---
 .../gateway-claim-form-section/index.js          | 16 +++++++++++++---
 pkg/webui/lib/shared-messages.js                 |  5 +++--
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index d3b85cb164..4b24e6b33e 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -41,7 +41,7 @@ const smUrl = 'https://accounts.thethingsindustries.com'
 
 const m = defineMessages({
   claimWarning:
-    'We detected a Managed gateway. To claim this gateway, please use the <strong>owner token printed on the gateway</strong>, or the <strong>gateway fleet owner token</strong>.',
+    'We detected a Managed gateway. To claim this gateway with a subscription, use the owner token printed on the gateway, or add it to your Gateway Fleet using your <Link>fleet owner token.</Link>',
   fleet: 'Fleet',
 })
 
@@ -105,7 +105,15 @@ const GatewayClaimFormSection = () => {
               info
               content={m.claimWarning}
               messageValues={{
-                strong: txt => <strong>{txt}</strong>,
+                Link: val => (
+                  <Link.Anchor
+                    secondary
+                    href={`${smUrl}/docs/hardware/gateways/models/thethingsindoorgatewaypro/#finding-your-owner-token`}
+                    external
+                  >
+                    {val}
+                  </Link.Anchor>
+                ),
               }}
               className="mb-0"
             />
@@ -150,7 +158,7 @@ const GatewayClaimFormSection = () => {
         }
         descriptionValues={{
           Link: val => (
-            <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
+            <Link.Anchor secondary href={`${smUrl}/dashboard/subscriptions?type=gateway`} external>
               {val}
             </Link.Anchor>
           ),
@@ -158,6 +166,8 @@ const GatewayClaimFormSection = () => {
         encode={btoa}
         decode={atob}
         sensitive
+        data-1p-ignore
+        data-lpignore
         autoFocus
       />
       <Form.Field
diff --git a/pkg/webui/lib/shared-messages.js b/pkg/webui/lib/shared-messages.js
index 17619f1188..dc12b6ec4e 100644
--- a/pkg/webui/lib/shared-messages.js
+++ b/pkg/webui/lib/shared-messages.js
@@ -279,8 +279,9 @@ export default defineMessages({
   fetching: 'Fetching data…',
   firmwareVersion: 'Firmware version',
   fleetInfo:
-    'Adding a gateway to a Fleet will claim the gateway using an <Link>available Slot.</Link>',
-  fleetTokenInfo: 'Your fleet token is available in <Link>your account.</Link>',
+    'Adding a gateway to a Fleet will claim the gateway using an available Slot. <Link>Read docs.</Link>',
+  fleetTokenInfo:
+    'Log in to <Link>your billing account.</Link> Select the fleet and copy the token.',
   format: 'Format',
   fpNotFoundError:
     'The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.',

From 7227e8bb64ef731eb8bbecb19e1cbfbfad629ebb Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 8 Dec 2025 16:33:43 +0100
Subject: [PATCH 21/23] console: Fix link

---
 .../gateway-claim-form-section/index.js                         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
index 4b24e6b33e..d74b312b67 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/gateway-provisioning-form/gateway-claim-form-section/index.js
@@ -108,7 +108,7 @@ const GatewayClaimFormSection = () => {
                 Link: val => (
                   <Link.Anchor
                     secondary
-                    href={`${smUrl}/docs/hardware/gateways/models/thethingsindoorgatewaypro/#finding-your-owner-token`}
+                    href="https://www.thethingsindustries.com/docs/hardware/gateways/models/thethingsindoorgatewaypro/#finding-your-owner-token"
                     external
                   >
                     {val}

From e63914fd616465bf3c750f7f1ed234937ffac2ba Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 8 Dec 2025 16:36:13 +0100
Subject: [PATCH 22/23] console: Fix link

---
 .../gateway-onboarding-form/qr-scan-section/fleets-scan.js  | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
index dbfaf8a837..024cc2bcff 100644
--- a/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
+++ b/pkg/webui/console/containers/gateway-onboarding-form/qr-scan-section/fleets-scan.js
@@ -78,7 +78,11 @@ const FleetsScan = ({ qrData, setQrData }) => {
             content={sharedMessages.fleetTokenInfo}
             values={{
               Link: val => (
-                <Link.Anchor secondary href={`${smUrl}/dashboard`} external>
+                <Link.Anchor
+                  secondary
+                  href={`${smUrl}/dashboard/subscriptions?type=gateway`}
+                  external
+                >
                   {val}
                 </Link.Anchor>
               ),

From e59135d39226c1e517fb20cf8436cb86e5388a6f Mon Sep 17 00:00:00 2001
From: Darya Plotnytska <d.plotnytska.s@gmail.com>
Date: Mon, 8 Dec 2025 16:44:34 +0100
Subject: [PATCH 23/23] console: Fix messages

---
 pkg/webui/locales/en.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/pkg/webui/locales/en.json b/pkg/webui/locales/en.json
index 890965157d..1a7e43bd40 100644
--- a/pkg/webui/locales/en.json
+++ b/pkg/webui/locales/en.json
@@ -614,7 +614,7 @@
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteSuccess": "WiFi profile deleted",
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteFail": "There was an error and the WiFi profile could not be deleted",
   "console.containers.gateway-managed-gateway.wifi-profiles.overview.deleteModalMessage": "The profile will not be applicable to gateways anymore and gateways using this profile might lose connectivity. Please make sure to update the gateway settings before deleting this profile.",
-  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.claimWarning": "We detected a Managed gateway. To claim this gateway, please use the <strong>owner token printed on the gateway</strong>, or the <strong>gateway fleet owner token</strong>.",
+  "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.claimWarning": "We detected a Managed gateway. To claim this gateway with a subscription, use the owner token printed on the gateway, or add it to your Gateway Fleet using your <Link>fleet owner token.</Link>",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-claim-form-section.index.fleet": "Fleet",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.requireAuthenticatedConnectionDescription": "Select which information can be seen by other network participants, including {packetBrokerURL}",
   "console.containers.gateway-onboarding-form.gateway-provisioning-form.gateway-registration-form-section.index.shareGatewayInfoDescription": "Choose this option eg. if your gateway is powered by {loraBasicStationURL}",
@@ -1442,8 +1442,8 @@
   "lib.shared-messages.fCnt": "FCnt",
   "lib.shared-messages.fetching": "Fetching data…",
   "lib.shared-messages.firmwareVersion": "Firmware version",
-  "lib.shared-messages.fleetInfo": "Adding a gateway to a Fleet will claim the gateway using an <Link>available Slot.</Link>",
-  "lib.shared-messages.fleetTokenInfo": "Your fleet token is available in <Link>your account.</Link>",
+  "lib.shared-messages.fleetInfo": "Adding a gateway to a Fleet will claim the gateway using an available Slot. <Link>Read docs.</Link>",
+  "lib.shared-messages.fleetTokenInfo": "Log in to <Link>your billing account.</Link> Select the fleet and copy the token.",
   "lib.shared-messages.format": "Format",
   "lib.shared-messages.fpNotFoundError": "The LoRaWAN version <code>{lorawanVersion}</code> does not support the <code>{freqPlan}</code> frequency plan. Please choose a different MAC version or frequency plan.",
   "lib.shared-messages.fPort": "FPort",