[Tech] Update hp ui to new exports (#1324)

* update hp ui to omega tag

* bump hp ui

* update hp ui with type exports

* bump hp ui

* bump hp ui

Author: BrettCleary

package.json

@@ -72,7 +72,7 @@
     "@hyperplay/chains": "^0.6.1",
     "@hyperplay/check-disk-space": "^3.5.2",
     "@hyperplay/quests-ui": "^0.4.0",
-    "@hyperplay/ui": "^1.30.14",
+    "@hyperplay/ui": "^1.32.1",
     "@hyperplay/utils": "^0.3.14",
     "@mantine/carousel": "^7.12.0",
     "@mantine/core": "^7.12.0",

pnpm-lock.yaml

@@ -1,13 +1,17 @@
 import React, { useContext, useEffect, useState } from 'react'
-import { DownloadToast, Images, CircularButton } from '@hyperplay/ui'
+import {
+  DownloadToast,
+  Images,
+  CircularButton,
+  DownloadStatus
+} from '@hyperplay/ui'
 import { DMQueueElement } from 'common/types'
 import { DMQueue } from 'frontend/types'
 import ContextProvider from 'frontend/state/ContextProvider'
 import { useTranslation } from 'react-i18next'
 import DownloadToastManagerStyles from './index.module.scss'
 import { launch } from 'frontend/helpers'
 import StopInstallationModal from '../StopInstallationModal'
-import { downloadStatus } from '@hyperplay/ui/dist/components/DownloadToast'
 import { useGetDownloadStatusText } from 'frontend/hooks/useGetDownloadStatusText'
 import DMQueueState from 'frontend/state/DMQueueState'
 import { isNotNative } from 'frontend/helpers/library'
@@ -153,7 +157,7 @@ export default function DownloadToastManager() {
   }
   const installPath = currentElement?.params.path
 
-  function getDownloadStatus(): downloadStatus {
+  function getDownloadStatus(): DownloadStatus {
     if (isPatching) return 'showOnlyCancel'
     if (isExtracting) return 'inExtraction'
     if (DMQueueState.isPaused(appName)) return 'paused'

src/frontend/components/UI/DownloadToastManager/index.tsx

@@ -1,5 +1,7 @@
 @use './styles/colors';
 @use './styles/buttons';
+@use '@hyperplay/ui/styles' as *;
+
 :root {
   @include colors.colorSystem;
 

src/frontend/index.scss

@@ -1,8 +1,11 @@
 import React from 'react'
 import walletState from 'frontend/state/WalletState'
-import { AchievementCard, AchievementSummaryTable } from '@hyperplay/ui'
+import {
+  AchievementCardProps,
+  AchievementCard,
+  AchievementSummaryTable
+} from '@hyperplay/ui'
 import { NavLink } from 'react-router-dom'
-import { StatusIconState } from '@hyperplay/ui/dist/components/AchievementCard/components/StatusIcon'
 import { useTranslation } from 'react-i18next'
 import { observer } from 'mobx-react-lite'
 import AchievementState, {
@@ -80,7 +83,7 @@ export default observer(function Achievements(): React.JSX.Element {
                       mintedAchievementsCount={game.mintedAchievementCount}
                       totalAchievementsCount={game.totalAchievementCount}
                       isNewAchievement={game.isNewAchievement}
-                      state={state as StatusIconState}
+                      state={state as AchievementCardProps['state']}
                       ctaProps={{
                         onClick: (e) => {
                           e.preventDefault()

src/frontend/screens/Achievements/index.tsx

@@ -1,4 +1,4 @@
-@import '@hyperplay/ui/utilities/_variables.scss';
+@use '@hyperplay/ui/utilities/_variables.scss' as *;
 
 .root {
   display: grid;

src/frontend/screens/Quests/index.module.scss

@@ -6,10 +6,10 @@ import {
   PhoneWaitingConfimationSpinner
 } from 'frontend/assets/hyperplay'
 import Loading from './Loading'
-import { statusType } from '@hyperplay/ui/dist/components/TransactionToasts'
+import { TransactionStatus } from '@hyperplay/ui'
 
 interface PhoneIconProps {
-  status: statusType
+  status: TransactionStatus
 }
 
 const PhoneIcon = ({ status }: PhoneIconProps) => {