@dcl-regenesislabs/web-editor 0.0.0-stage → 0.1.0

package/prefabs/admin-tools/scripts/tabs/rewards/claim.ts

@@ -0,0 +1,99 @@
+// The CLAIM_AIRDROP flow from @dcl/asset-packs src/actions.ts (~line 1544), as a
+// standalone module: read the dispenser's asset-packs::Rewards config, look the
+// campaign up by dispenser key, and either claim straight away or hand the caller
+// a captcha to solve first. Test mode short-circuits, like the Hub's interpreter.
+import type { Entity } from '@dcl/sdk/ecs'
+import { getPlayer } from '@dcl/sdk/players'
+import { loadRealm } from '../../api'
+import { Rewards } from '../../components'
+import {
+  claimReward,
+  fetchCampaigns,
+  fetchCaptcha,
+  isCaptchaRequired,
+  type RewardCaptcha
+} from './api'
+
+export const CLAIM_AIRDROP_ACTION = 'claim_airdrop'
+
+export interface PendingCaptcha {
+  campaignId: string
+  dispenserKey: string
+  captcha: RewardCaptcha
+}
+
+export type ClaimOutcome =
+  | { kind: 'claimed'; message: string }
+  | { kind: 'captcha'; pending: PendingCaptcha }
+  | { kind: 'test-mode' }
+  | { kind: 'error'; message: string }
+
+function failed(message: string): ClaimOutcome {
+  return { kind: 'error', message }
+}
+
+function beneficiary(): string {
+  const player = getPlayer()
+  if (player === null || player.isGuest) return ''
+  return player.userId.toLowerCase()
+}
+
+async function catalyst(): Promise<string> {
+  const realm = await loadRealm()
+  return realm?.baseUrl ?? ''
+}
+
+async function promptCaptcha(campaignId: string, dispenserKey: string): Promise<ClaimOutcome> {
+  const [error, captcha] = await fetchCaptcha()
+  if (error !== null) return failed(error)
+  return { kind: 'captcha', pending: { campaignId, dispenserKey, captcha } }
+}
+
+async function claim(
+  campaignId: string,
+  dispenserKey: string,
+  captcha?: { id: string; value: string }
+): Promise<ClaimOutcome> {
+  const [error, summary] = await claimReward({
+    dispenserKey,
+    beneficiary: beneficiary(),
+    catalyst: await catalyst(),
+    captchaId: captcha?.id,
+    captchaValue: captcha?.value
+  })
+
+  if (error !== null) {
+    // The dispenser may demand a captcha even when the campaign flag says
+    // otherwise — the newer Hub dispenser script reads the same signal.
+    if (captcha === undefined && isCaptchaRequired(error)) return promptCaptcha(campaignId, dispenserKey)
+    return failed(error)
+  }
+  const reward = summary.count === 1 ? 'reward' : 'rewards'
+  return { kind: 'claimed', message: `Airdrop released — ${summary.count} ${reward} ${summary.status}.` }
+}
+
+/** Runs the airdrop claim for a dispenser entity carrying asset-packs::Rewards. */
+export async function releaseAirdrop(entity: Entity): Promise<ClaimOutcome> {
+  const rewards = Rewards.getOrNull(entity)
+  if (rewards === null) return failed('This item has no Rewards configuration.')
+
+  const { campaignId, dispenserKey, testMode } = rewards
+  if (testMode) return { kind: 'test-mode' }
+  if (dispenserKey === '') return failed('This item has no dispenser key set.')
+
+  const [error, campaigns] = await fetchCampaigns(dispenserKey)
+  if (error !== null) return failed(error)
+
+  const campaign = campaigns.find((entry) => entry.campaignId === campaignId)
+  if (campaign === undefined) return failed('No campaign matches this dispenser key.')
+  if (!campaign.enabled) return failed('This campaign is disabled on rewards.decentraland.org.')
+  if (campaign.requiresCaptcha) return promptCaptcha(campaignId, dispenserKey)
+
+  return claim(campaignId, dispenserKey)
+}
+
+export async function submitCaptcha(pending: PendingCaptcha, value: string): Promise<ClaimOutcome> {
+  const answer = value.trim()
+  if (answer === '') return failed('Enter the captcha to continue.')
+  return claim(pending.campaignId, pending.dispenserKey, { id: pending.captcha.id, value: answer })
+}

package/prefabs/admin-tools/scripts/tabs/rewards/controller.ts

@@ -0,0 +1,103 @@
+// What the Release / Clear / Submit buttons do. Same contract as the Creator Hub's
+// RewardsControl: Release runs the dispenser's "Airdrop" action and Clear runs its
+// "Invisible" one. The names are the Hub's convention, so an action of the matching
+// *type* is accepted as a fallback for items authored with different labels.
+import type { Entity } from '@dcl/sdk/ecs'
+import { ActionType, getActions, runAction } from '../../actions'
+import type { ActionEntry, RewardItemRef } from '../../components'
+import { Rewards } from '../../components'
+import { CLAIM_AIRDROP_ACTION, releaseAirdrop, submitCaptcha, type ClaimOutcome } from './claim'
+import { clearCaptcha, rewardsTabState, setStatus } from './state'
+
+export const RELEASE_ACTION = 'Airdrop'
+export const CLEAR_ACTION = 'Invisible'
+
+export function selectedEntity(
+  items: readonly RewardItemRef[],
+  index: number | undefined
+): Entity | null {
+  if (index === undefined || index < 0 || index >= items.length) return null
+  return items[index].entity as Entity
+}
+
+function findAction(entity: Entity, name: string, type: string): ActionEntry | undefined {
+  const actions = getActions(entity)
+  return actions.find((action) => action.name === name) ?? actions.find((action) => action.type === type)
+}
+
+function describe(error: unknown): string {
+  return error instanceof Error ? error.message : String(error)
+}
+
+function applyOutcome(outcome: ClaimOutcome): void {
+  switch (outcome.kind) {
+    case 'claimed':
+      clearCaptcha()
+      setStatus(outcome.message, 'success')
+      break
+    case 'captcha':
+      rewardsTabState.pending = outcome.pending
+      rewardsTabState.answer = ''
+      setStatus('Solve the captcha to release this airdrop.')
+      break
+    case 'test-mode':
+      clearCaptcha()
+      setStatus('Test mode is on for this item — nothing was assigned.')
+      break
+    case 'error':
+      setStatus(outcome.message, 'error')
+      break
+  }
+}
+
+async function run(task: Promise<ClaimOutcome>): Promise<void> {
+  rewardsTabState.busy = true
+  try {
+    applyOutcome(await task)
+  } catch (error) {
+    setStatus(describe(error), 'error')
+  } finally {
+    rewardsTabState.busy = false
+  }
+}
+
+export function release(entity: Entity): void {
+  if (rewardsTabState.busy) return
+  const action = findAction(entity, RELEASE_ACTION, CLAIM_AIRDROP_ACTION)
+
+  if (action !== undefined && action.type !== CLAIM_AIRDROP_ACTION) {
+    runAction(entity, action)
+    clearCaptcha()
+    setStatus(`Ran "${action.name}" on this item.`, 'success')
+    return
+  }
+
+  clearCaptcha()
+  setStatus('Releasing airdrop…')
+  void run(releaseAirdrop(entity))
+}
+
+export function clear(entity: Entity): void {
+  if (rewardsTabState.busy) return
+  if (Rewards.getOrNull(entity) === null) {
+    setStatus('This item has no Rewards configuration.', 'error')
+    return
+  }
+
+  const action = findAction(entity, CLEAR_ACTION, ActionType.SET_VISIBILITY)
+  if (action === undefined) {
+    setStatus(`This item has no "${CLEAR_ACTION}" action to clear it with.`, 'error')
+    return
+  }
+
+  runAction(entity, action)
+  clearCaptcha()
+  setStatus('Airdrop cleared.', 'success')
+}
+
+export function submit(): void {
+  const pending = rewardsTabState.pending
+  if (pending === null || rewardsTabState.busy) return
+  setStatus('Checking the captcha…')
+  void run(submitCaptcha(pending, rewardsTabState.answer))
+}

package/prefabs/admin-tools/scripts/tabs/rewards/icons.ts

@@ -0,0 +1,13 @@
+import { iconPath } from '../../icons'
+
+export interface RewardsIcons {
+  send: string
+  close: string
+}
+
+export function rewardsIcons(base: string): RewardsIcons {
+  return {
+    send: iconPath(base, 'rewards/send.png'),
+    close: iconPath(base, 'rewards/close.png')
+  }
+}

package/prefabs/admin-tools/scripts/tabs/rewards/state.ts

@@ -0,0 +1,32 @@
+// Per-tab UI state. The shared AdminState only carries the selected airdrop, so
+// the in-flight claim (busy flag, feedback line, captcha challenge) lives here —
+// one panel per scene, so a module singleton is enough.
+import type { PendingCaptcha } from './claim'
+
+export type StatusTone = 'info' | 'error' | 'success'
+
+export interface RewardsTabState {
+  busy: boolean
+  status: string
+  tone: StatusTone
+  pending: PendingCaptcha | null
+  answer: string
+}
+
+export const rewardsTabState: RewardsTabState = {
+  busy: false,
+  status: '',
+  tone: 'info',
+  pending: null,
+  answer: ''
+}
+
+export function setStatus(status: string, tone: StatusTone = 'info'): void {
+  rewardsTabState.status = status
+  rewardsTabState.tone = tone
+}
+
+export function clearCaptcha(): void {
+  rewardsTabState.pending = null
+  rewardsTabState.answer = ''
+}

package/prefabs/admin-tools/scripts/tabs/smart-items/selection.ts

@@ -0,0 +1,90 @@
+// Smart-item list building and per-item panel state.
+//
+// `linkAllSmartItems` is a plain flag in the inspector — nothing populates the
+// list from it — so it is honoured here: with it on, every entity carrying
+// asset-packs::Actions joins the dropdown, named after core-schema::Name.
+import { engine, Name, VisibilityComponent, type Entity } from '@dcl/sdk/ecs'
+import { getActions } from '../../actions'
+import { Actions, type AdminToolsValue } from '../../components'
+import type { AdminState, SmartItemUiState } from '../../state'
+
+export interface SmartItemEntry {
+  entity: Entity
+  customName: string
+  defaultAction: string
+}
+
+export interface SmartItemsUiState {
+  lastPlayed: string
+  lastPlayedFailed: boolean
+}
+
+export const smartItemsUi: SmartItemsUiState = { lastPlayed: '', lastPlayedFailed: false }
+
+function labelFor(entity: Entity): string {
+  const name = Name.getOrNull(entity)
+  return name !== null && name.value !== '' ? name.value : `Entity ${entity as number}`
+}
+
+export function smartItemList(config: AdminToolsValue, self: Entity): SmartItemEntry[] {
+  const entries: SmartItemEntry[] = []
+  const seen = new Set<number>()
+
+  for (const item of config.smartItemsControl.smartItems ?? []) {
+    if (item.entity === 0 || seen.has(item.entity)) continue
+    seen.add(item.entity)
+    const entity = item.entity as Entity
+    entries.push({
+      entity,
+      customName: item.customName === '' ? labelFor(entity) : item.customName,
+      defaultAction: item.defaultAction
+    })
+  }
+
+  if (!config.smartItemsControl.linkAllSmartItems) return entries
+
+  const discovered: SmartItemEntry[] = []
+  for (const [entity] of engine.getEntitiesWith(Actions)) {
+    if (entity === self || seen.has(entity as number)) continue
+    seen.add(entity as number)
+    discovered.push({
+      entity,
+      customName: labelFor(entity),
+      defaultAction: getActions(entity)[0]?.name ?? ''
+    })
+  }
+  discovered.sort((a, b) => (a.entity as number) - (b.entity as number))
+  return [...entries, ...discovered]
+}
+
+export function uiStateFor(state: AdminState, item: SmartItemEntry): SmartItemUiState {
+  const existing = state.smartItems.byEntity.get(item.entity)
+  if (existing !== undefined) return existing
+  const created: SmartItemUiState = {
+    visible: VisibilityComponent.getOrNull(item.entity)?.visible ?? true,
+    selectedAction: item.defaultAction
+  }
+  state.smartItems.byEntity.set(item.entity, created)
+  return created
+}
+
+export function selectedItem(state: AdminState, items: SmartItemEntry[]): SmartItemEntry | undefined {
+  const index = state.smartItems.selectedIndex
+  if (index === undefined || index < 0 || index >= items.length) return undefined
+  return items[index]
+}
+
+export function selectSmartItem(state: AdminState, items: SmartItemEntry[], index: number): void {
+  if (index < 0 || index >= items.length) return
+  state.smartItems.selectedIndex = index
+  uiStateFor(state, items[index])
+  smartItemsUi.lastPlayed = ''
+  smartItemsUi.lastPlayedFailed = false
+}
+
+export function setVisible(state: AdminState, item: SmartItemEntry, visible: boolean): void {
+  uiStateFor(state, item).visible = visible
+  const existing = VisibilityComponent.getMutableOrNull(item.entity)
+  if (existing === null) VisibilityComponent.create(item.entity, { visible })
+  else existing.visible = visible
+}

package/prefabs/admin-tools/scripts/tabs/video/DclCast.tsx

@@ -0,0 +1,226 @@
+import ReactEcs, { Label, UiEntity } from '@dcl/sdk/react-ecs'
+import { VideoPlayer, type Entity } from '@dcl/sdk/ecs'
+import { copyToClipboard } from '~system/RestrictedActions'
+import { VideoControlState } from '../../components'
+import { ensurePresenterRole, getCastRoom, resetStreamKey } from './api'
+import { LIVEKIT_STREAM_SRC, type VideoControls } from './controls'
+import type { VideoIcons } from './icons'
+import { ensureSpeakerPolling, refreshSpeakers } from './speakers'
+import { markCopied, videoTab, wasCopied } from './state'
+import { SpeakerShowcase } from './SpeakerShowcase'
+import { Volume } from './Volume'
+import { Button, COLORS, Column, Divider, ErrorNote, Hint, Row, SubHeader } from './ui'
+
+export function DclCast(props: {
+  self: Entity
+  entity: Entity
+  icons: VideoIcons
+  controls: VideoControls
+  soundDisabled: boolean
+  playerAddress: string | undefined
+  active: boolean
+}): ReactEcs.JSX.Element {
+  const [loading, setLoading] = ReactEcs.useState(videoTab.castRoom === undefined)
+
+  const fetchRoom = (): void => {
+    setLoading(true)
+    videoTab.castError = ''
+    void (async () => {
+      const [error, room] = await getCastRoom()
+      if (error !== null) videoTab.castError = error
+      else videoTab.castRoom = room
+      setLoading(false)
+    })()
+  }
+
+  ReactEcs.useEffect(() => {
+    ensureSpeakerPolling()
+    if (videoTab.castRoom === undefined) fetchRoom()
+    else setLoading(false)
+    if (props.playerAddress !== undefined) void ensurePresenterRole(props.playerAddress)
+  }, [])
+
+  const room = videoTab.castRoom
+  const showSpeakers = videoTab.showSpeakers
+
+  return (
+    <Column>
+      <Row uiTransform={{ justifyContent: 'space-between' }}>
+        <SubHeader icon={props.icons.sourceCast} title="DCL Cast" />
+        <UiEntity
+          uiTransform={{ width: 20, height: 20, display: props.active ? 'flex' : 'none' }}
+          uiBackground={{
+            textureMode: 'stretch',
+            texture: { src: props.icons.star },
+            color: COLORS.success
+          }}
+        />
+      </Row>
+      <Hint text="Use a browser-based DCL Cast room to stream camera and screen feeds onto this screen." />
+
+      {loading ? <Hint text="Loading room…" uiTransform={{ margin: { top: 16 } }} /> : null}
+
+      {!loading && videoTab.castError !== '' ? (
+        <Column uiTransform={{ margin: { top: 12 } }}>
+          <ErrorNote icon={props.icons.error} text={videoTab.castError} />
+          <Row uiTransform={{ margin: { top: 8 } }}>
+            <Button label="Retry" uiTransform={{ width: 'auto' }} onClick={fetchRoom} />
+          </Row>
+        </Column>
+      ) : null}
+
+      {!loading && room !== undefined ? (
+        <Column uiTransform={{ margin: { top: 12 } }}>
+          <Row uiTransform={{ justifyContent: 'space-between' }}>
+            <Column uiTransform={{ width: 'auto' }}>
+              <Label
+                value="<b>Room ID</b>"
+                fontSize={20}
+                color={COLORS.white}
+                textAlign="middle-left"
+                uiTransform={{ height: 26 }}
+              />
+              <Hint text={`Expires in ${room.expiresInDays} days`} />
+            </Column>
+            {props.active ? (
+              <Button
+                label="Deactivate"
+                variant="text"
+                uiTransform={{ width: 'auto' }}
+                onClick={() => {
+                  props.controls.setSource('')
+                  videoTab.activeTrackSid = undefined
+                }}
+              />
+            ) : (
+              <Button
+                label="Activate"
+                variant="success"
+                uiTransform={{ width: 'auto' }}
+                onClick={() => {
+                  props.controls.setSource(LIVEKIT_STREAM_SRC)
+                  videoTab.activeTrackSid = undefined
+                  videoTab.source = 'dcl-cast'
+                }}
+              />
+            )}
+          </Row>
+
+          <Divider />
+
+          <Row uiTransform={{ justifyContent: 'space-between' }}>
+            <Column uiTransform={{ width: '62%' }}>
+              <Label
+                value="<b>Cast speakers</b>"
+                fontSize={16}
+                color={COLORS.white}
+                textAlign="middle-left"
+                uiTransform={{ height: 22 }}
+              />
+              <Hint text="This link grants streaming access." />
+            </Column>
+            <Button
+              label={wasCopied('stream-link') ? 'Copied!' : 'Copy Link'}
+              variant="text"
+              iconRight={props.icons.copy}
+              uiTransform={{ width: 'auto' }}
+              onClick={() => {
+                if (room.streamLink === '') return
+                void copyToClipboard({ text: room.streamLink })
+                markCopied('stream-link')
+              }}
+            />
+          </Row>
+
+          <Divider />
+
+          <Row uiTransform={{ justifyContent: 'space-between' }}>
+            <Column uiTransform={{ width: '62%' }}>
+              <Label
+                value="<b>Viewers</b>"
+                fontSize={16}
+                color={COLORS.white}
+                textAlign="middle-left"
+                uiTransform={{ height: 22 }}
+              />
+              <Hint text="This link grants viewing access." />
+            </Column>
+            <Button
+              label={wasCopied('watcher-link') ? 'Copied!' : 'Copy Link'}
+              variant="text"
+              iconRight={props.icons.copy}
+              uiTransform={{ width: 'auto' }}
+              onClick={() => {
+                if (room.watcherLink === '') return
+                void copyToClipboard({ text: room.watcherLink })
+                markCopied('watcher-link')
+              }}
+            />
+          </Row>
+
+          <Volume
+            label="Cast controls"
+            entity={props.entity}
+            icons={props.icons}
+            controls={props.controls}
+            soundDisabled={props.soundDisabled}
+          />
+
+          <Row uiTransform={{ margin: { top: 16 }, justifyContent: 'space-between' }}>
+            <Button
+              label={showSpeakers ? 'Hide Speakers' : 'Speakers'}
+              icon={props.icons.star}
+              iconRight={showSpeakers ? props.icons.chevronUp : props.icons.chevronDown}
+              disabled={!props.active}
+              uiTransform={{ width: 'auto' }}
+              onClick={() => {
+                videoTab.showSpeakers = !showSpeakers
+                if (!showSpeakers) refreshSpeakers()
+              }}
+            />
+            <Button
+              label="Reset Room"
+              variant="danger"
+              uiTransform={{ width: 'auto' }}
+              onClick={() => {
+                setLoading(true)
+                void (async () => {
+                  const [error, data] = await resetStreamKey()
+                  if (error !== null) {
+                    videoTab.castError = error
+                    setLoading(false)
+                    return
+                  }
+                  const state = VideoControlState.getMutableOrNull(props.self)
+                  if (state !== null) state.endsAt = data.endsAt
+                  videoTab.castRoom = undefined
+                  videoTab.activeTrackSid = undefined
+                  fetchRoom()
+                })()
+              }}
+            />
+          </Row>
+
+          {showSpeakers && props.active ? (
+            <SpeakerShowcase
+              icons={props.icons}
+              onSelectTrack={(track) => {
+                props.controls.setSource(track.sid)
+                videoTab.activeTrackSid = track.sid
+                videoTab.source = 'dcl-cast'
+              }}
+              onAutomatic={() => {
+                props.controls.setSource(LIVEKIT_STREAM_SRC)
+                videoTab.activeTrackSid = undefined
+              }}
+            />
+          ) : null}
+        </Column>
+      ) : null}
+
+      {VideoPlayer.getOrNull(props.entity) === null ? (
+        <ErrorNote icon={props.icons.error} text="This screen has no VideoPlayer component." />
+      ) : null}
+    </Column>
+  )
+}