How to use decentraland-dapps - 10 common examples

if (project) {
    // load asset packs
    const areLoaded = yield select(hasLoadedAssetPacks)
    if (!areLoaded) {
      yield put(loadAssetPacksRequest())
    }

    // fix legacy stuff
    let scene: Scene = yield getSceneByProjectId(project.id, type)
    yield put(fixLegacyNamespacesRequest(scene))
    const fixSuccessAction: FixLegacyNamespacesSuccessAction = yield take(FIX_LEGACY_NAMESPACES_SUCCESS)
    scene = fixSuccessAction.payload.scene

    // if assets packs are being loaded wait for them to finish
    const state: RootState = yield select(state => state)
    if (isLoadingType(state.assetPack.loading, LOAD_ASSET_PACKS_REQUEST)) {
      yield take(LOAD_ASSET_PACKS_SUCCESS)
    }

    // sync scene assets
    yield put(syncSceneAssetsRequest(scene))
    const syncSuccessAction = yield take(SYNC_SCENE_ASSETS_SUCCESS)
    scene = syncSuccessAction.payload.scene

    yield put(setEditorReadOnly(isReadOnly))
    yield createNewEditorScene(project)

    // Set the remote url for scripts
    yield call(() => editorWindow.editor.sendExternalAction(setScriptUrl(`${BUILDER_SERVER_URL}/storage/assets`)))

    // Spawns the assets
    yield renderScene(scene)

import ViewPort from 'components/ViewPort'
import SideBar from 'components/SideBar'
import LocalStorageToast from 'components/LocalStorageToast'
import Tools from './Tools'
import Metrics from './Metrics'
import ItemDragLayer from './ItemDragLayer'
import { ToolName } from './Tools/Tools.types'
import { Props, State } from './EditorPage.types'

import './EditorPage.css'

export const LOCALSTORAGE_TUTORIAL_KEY = 'builder-tutorial'
export const LOCALSTORAGE_INCENTIVE_BANNER_KEY = 'builder-incentive-banner'
const TOAST_ITEMS_THRESHOLD = 5 // local storage toast will show when a user has at least this amount of items

const localStorage = getLocalStorage()

export default class EditorPage extends React.PureComponent {
  state = {
    isIncentiveBannerOpen: false
  }

  componentWillMount() {
    const { currentProject, onOpenModal } = this.props

    if (currentProject && !localStorage.getItem(LOCALSTORAGE_TUTORIAL_KEY)) {
      const showTutorial = experiments.getCurrentValueFor(EXPERIMENT_TUTORIAL_OPEN, true)
      if (showTutorial) {
        onOpenModal('TutorialModal')
      }
    }

import * as React from 'react'
import { env } from 'decentraland-commons'
import { Button, Close } from 'decentraland-ui'
import { getAnalytics } from 'decentraland-dapps/dist/modules/analytics/utils'
import Modal from 'decentraland-dapps/dist/containers/Modal'
import { getLocalStorage } from 'decentraland-dapps/dist/lib/localStorage'
import { t } from 'decentraland-dapps/dist/modules/translation/utils'

import { LOCALSTORAGE_TUTORIAL_KEY } from 'components/EditorPage/EditorPage'
import { preventDefault } from 'lib/preventDefault'
import { getSlides } from './slides'
import { Props, State } from './TutorialModal.types'
import './TutorialModal.css'

const PUBLIC_URL = env.get('PUBLIC_URL')
const localStorage = getLocalStorage()

// Segment Events
const TUTORIAL_STEP_EVENT = 'Tutorial Step'
const TUTORIAL_SKIP_EVENT = 'Tutorial Skip'
const TUTORIAL_COMPLETE = 'Tutorial Complete'

export const LOCALSTORAGE_TUTORIAL_EMAIL_KEY = 'builder-tutorial-email'

export default class TutorialModal extends React.PureComponent {
  state = {
    step: 0
  }

  slides = getSlides()

  preventVideoContextMenu = preventDefault()

import * as React from 'react'
import { Popup, Row, Close } from 'decentraland-ui'
import { getLocalStorage } from 'decentraland-dapps/dist/lib/localStorage'
import { t } from 'decentraland-dapps/dist/modules/translation/utils'

import Icon from 'components/Icon'
import ShortcutTooltip from 'components/ShortcutTooltip'
import { IconName } from 'components/Icon/Icon.types'
import { debounce } from 'lib/debounce'
import { Shortcut } from 'modules/keyboard/types'
import { ToolName, Props, DefaultProps, State } from './Tools.types'

export const LOCALSTORAGE_SHORTCUT_POPUP_KEY = 'builder-shortcut-popup'
const localStorage = getLocalStorage()

export default class Tools extends React.PureComponent {
  static defaultProps: DefaultProps = {
    onClick: (_: ToolName) => {
      /* noop */
    }
  }

  state = {
    isShortcutPopupOpen: this.isShortcutPopupDismissed()
  }

  _isMounted: boolean = false

  updatePopupPositionDebounced = debounce(() => this.updatePopupPosition(), 200)

const storage: ReturnType = yield select(getStorage)
    const projects: ReturnType = yield select(getProjects)
    const scenes: ReturnType = yield select(getScenes)
    const user: ReturnType = yield select(getUser)

    const project: Omit = utils.omit(projects[projectId], ['thumbnail'])

    const entry = {
      version: storage.version,
      scene: scenes[project.sceneId],
      project,
      contest,
      user: utils.pick(user, ['id'])
    }

    const analytics = getAnalytics()
    if (contest.ethAddress) {
      analytics.identify(contest.ethAddress, { email: contest.email })
    } else {
      analytics.identify({ email: contest.email })
    }

    yield call(() => api.submitToContest(JSON.stringify(entry)))

    yield put(submitProjectSuccess(projectId, contest))
  } catch (error) {
    yield put(submitProjectFailure(error.message))
  }
}

return name === 'AddToContestModal' ? { ...state, error: null } : state
    }
    case ACCEPT_TERMS: {
      return {
        ...state,
        data: {
          ...state.data,
          hasAcceptedTerms: true
        }
      }
    }
    case SUBMIT_PROJECT_REQUEST: {
      return {
        ...state,
        error: null,
        loading: loadingReducer(state.loading, action)
      }
    }
    case SUBMIT_PROJECT_SUCCESS: {
      const { projectId, contest } = action.payload
      return {
        ...state,
        loading: loadingReducer(state.loading, action),
        error: null,
        data: {
          ...state.data,
          ...contest,
          projects: { ...state.data.projects, [projectId]: Date.now() }
        }
      }
    }
    case SUBMIT_PROJECT_FAILURE: {

import * as React from 'react'
import { Button, Page } from 'decentraland-ui'
import { t } from 'decentraland-dapps/dist/modules/translation/utils'
import { getAnalytics } from 'decentraland-dapps/dist/modules/analytics/utils'
import { IntercomWidget } from 'decentraland-dapps/dist/components/Intercom/IntercomWidget'

import Navbar from 'components/Navbar'
import Footer from 'components/Footer'
import { Props } from './ErrorPage.types'
import './ErrorPage.css'

const widget = IntercomWidget.getInstance()

export default class ErrorPage extends React.PureComponent {
  analytics = getAnalytics()

  componentDidMount() {
    document.body.classList.add('error-body')
    this.analytics.track('Error page', {})
  }

  componentWillUnmount() {
    document.body.classList.remove('error-body')
  }

  handleOnClick = () => {
    const { stackTrace } = this.props
    const lines = stackTrace.split('\n')

renderLogin() {
    return (
      <>
        
        
          
            <button>
              {t('asset_pack.login.action')}
            </button>
          
        
      
    )
  }

renderHold() {
    return (
      <span>
        {t('shortcuts.hold')}
      </span>
    )
  }
}

export function getTemplates(): Template[] {
  return [
    {
      title: t('templates.small'),
      description: t('templates.description', { dimensions: getDimensions(1, 1), amount: 20 }),
      thumbnail: 'thumb-1x1',
      rows: 1,
      cols: 1
    },
    {
      title: t('templates.medium'),
      description: t('templates.description', { dimensions: getDimensions(2, 2), amount: 80 }),
      thumbnail: 'thumb-2x2',
      rows: 2,
      cols: 2
    },
    {
      title: t('templates.big'),
      description: t('templates.description', { dimensions: getDimensions(2, 3), amount: 120 }),
      thumbnail: 'thumb-2x3',