@rpg-engine/long-bow 0.8.21 → 0.8.22

package/src/components/InformationCenter/sections/tutorials/InformationCenterTutorialsSection.tsx

@@ -1,9 +1,15 @@
-import React, { useState } from 'react';
+import {
+  IVideoGuide,
+  VideoGuideCategory,
+  VideoGuideLanguage,
+} from '@rpg-engine/shared';
+import React, { useMemo, useState } from 'react';
 import styled from 'styled-components';
 import { uiColors } from '../../../../constants/uiColors';
 import { IOptionsProps } from '../../../Dropdown';
 import { PaginatedContent } from '../../../shared/PaginatedContent/PaginatedContent';
-import { IVideoGuide } from '../../InformationCenter';
+
+import { formatItemType } from '../items/InformationCenterItemsSection';
 
 interface ITutorialsSectionProps {
   videoGuides: IVideoGuide[];
@@ -11,6 +17,9 @@ interface ITutorialsSectionProps {
   tabId: string;
 }
 
+const ITEMS_PER_PAGE = 3;
+const GRID_COLUMNS = 3;
+
 export const InformationCenterTutorialsSection: React.FC<ITutorialsSectionProps> = ({
   videoGuides,
   initialSearchQuery,
@@ -18,37 +27,96 @@ export const InformationCenterTutorialsSection: React.FC<ITutorialsSectionProps>
 }) => {
   const [searchQuery, setSearchQuery] = useState(initialSearchQuery);
   const [selectedCategory, setSelectedCategory] = useState<string>('all');
+  const [, setCurrentPage] = useState(1);
 
+  const getYouTubeThumbnail = (videoUrl: string): string => {
+    const regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|&v=)([^#&?]*).*/;
+    const match = videoUrl.match(regExp);
+    const videoId = match && match[2].length === 11 ? match[2] : null;
+
+    return videoId
+      ? `https://img.youtube.com/vi/${videoId}/hqdefault.jpg`
+      : '/placeholder-thumbnail.png';
+  };
   const categoryOptions: IOptionsProps[] = [
-    { id: 0, value: 'all', option: 'All' },
-    { id: 1, value: 'Combat', option: 'Combat' },
-    { id: 2, value: 'Crafting', option: 'Crafting' },
-    { id: 3, value: 'Exploration', option: 'Exploration' },
-    { id: 4, value: 'General', option: 'General' },
+    { id: 0, value: 'all', option: 'All Categories' },
+    ...(VideoGuideCategory
+      ? Object.entries(VideoGuideCategory).map(([, value], index) => ({
+          id: index + 1,
+          value: value as string,
+          option: formatItemType(value),
+        }))
+      : []),
+    ...(VideoGuideLanguage
+      ? Object.entries(VideoGuideLanguage).map(([, value], index) => ({
+          id:
+            index +
+            (VideoGuideCategory
+              ? Object.entries(VideoGuideCategory).length
+              : 0) +
+            1,
+          value: value as string,
+          option: formatItemType(value),
+        }))
+      : []),
   ];
 
+  const handleVideoClick = (videoUrl: string) => {
+    window.open(videoUrl, '_blank', 'noopener,noreferrer');
+  };
+
   const renderItem = (guide: IVideoGuide) => (
-    <GuideItem key={guide.id}>
+    <GuideItem key={guide.id} onClick={() => handleVideoClick(guide.videoUrl)}>
       <GuideThumbnail>
         <img
-          src={guide.thumbnailUrl || '/placeholder-thumbnail.png'}
+          src={guide.localImage || getYouTubeThumbnail(guide.videoUrl)}
           alt={guide.title}
         />
       </GuideThumbnail>
       <GuideContent>
         <GuideTitle>{guide.title}</GuideTitle>
         <GuideDescription>{guide.description}</GuideDescription>
-        <GuideCategory>{guide.category}</GuideCategory>
+        <GuideLabelsContainer>
+          <GuideCategory>{guide.category}</GuideCategory>
+          <GuideLanguage>{guide.language}</GuideLanguage>
+        </GuideLabelsContainer>
       </GuideContent>
     </GuideItem>
   );
 
-  const filteredGuides = videoGuides.filter(
-    guide =>
-      (selectedCategory === 'all' || guide.category === selectedCategory) &&
-      (guide.title.toLowerCase().includes(searchQuery.toLowerCase()) ||
-        guide.description.toLowerCase().includes(searchQuery.toLowerCase()))
-  );
+  const filteredGuides = useMemo(() => {
+    return videoGuides.filter(guide => {
+      const matchesSearch =
+        guide.title.toLowerCase().includes(searchQuery.toLowerCase()) ||
+        guide.description.toLowerCase().includes(searchQuery.toLowerCase());
+
+      const matchesCategory =
+        selectedCategory === 'all' ||
+        (Object.values(VideoGuideCategory).includes(
+          selectedCategory as VideoGuideCategory
+        ) &&
+          guide.category === selectedCategory) ||
+        (Object.values(VideoGuideLanguage).includes(
+          selectedCategory as VideoGuideLanguage
+        ) &&
+          guide.language === selectedCategory);
+
+      return matchesSearch && matchesCategory;
+    });
+  }, [videoGuides, searchQuery, selectedCategory]);
+
+  const handleSearchChange = (newQuery: string) => {
+    setSearchQuery(newQuery);
+    setCurrentPage(1);
+    if (newQuery && selectedCategory !== 'all') {
+      setSelectedCategory('all');
+    }
+  };
+
+  const handleCategoryChange = (category: string) => {
+    setSelectedCategory(category);
+    setCurrentPage(1);
+  };
 
   return (
     <PaginatedContent<IVideoGuide>
@@ -57,20 +125,20 @@ export const InformationCenterTutorialsSection: React.FC<ITutorialsSectionProps>
       emptyMessage="No guides found"
       searchOptions={{
         value: searchQuery,
-        onChange: setSearchQuery,
+        onChange: handleSearchChange,
         placeholder: 'Search guides...',
       }}
       filterOptions={{
         options: categoryOptions,
         selectedOption: selectedCategory,
-        onOptionChange: setSelectedCategory,
+        onOptionChange: handleCategoryChange,
       }}
       dependencies={[selectedCategory]}
       tabId={tabId}
       layout="grid"
-      gridColumns={3}
-      itemsPerPage={3}
-      itemHeight="400px"
+      gridColumns={GRID_COLUMNS}
+      itemsPerPage={ITEMS_PER_PAGE}
+      itemHeight="320px"
     />
   );
 };
@@ -82,7 +150,10 @@ const GuideItem = styled.div`
   border: 1px solid ${uiColors.darkGray};
   cursor: pointer;
   transition: transform 0.2s ease;
+  display: flex;
+  flex-direction: column;
   height: 100%;
+  padding: 0;
   &:hover {
     transform: translateY(-2px);
   }
@@ -99,37 +170,65 @@ const GuideThumbnail = styled.div`
     height: 100%;
     object-fit: cover;
   }
-
-  font-size: 0.8rem;
-  line-height: 1.8;
 `;
 
 const GuideContent = styled.div`
-  padding: 12px;
+  padding: 0 12px 12px;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 `;
 
 const GuideTitle = styled.h3`
   margin: 0;
-  font-size: 0.6rem;
+  font-size: 0.6rem !important;
   color: ${uiColors.yellow};
   font-family: 'Press Start 2P', cursive;
-  margin-bottom: 8px;
+  margin-bottom: 5px;
 `;
 
 const GuideDescription = styled.p`
   margin: 0;
-  font-size: 0.55rem;
+  font-size: 0.5rem !important;
   color: ${uiColors.lightGray};
+  text-align: center;
   font-family: 'Press Start 2P', cursive;
   margin-bottom: 8px;
   line-height: 1.4;
 `;
 
-const GuideCategory = styled.span`
-  font-size: 0.5rem;
-  color: ${uiColors.yellow};
+const GuideCategory = styled.label`
+  font-size: 0.5rem !important;
   font-family: 'Press Start 2P', cursive;
-  background: rgba(255, 255, 255, 0.1);
-  padding: 4px 8px;
-  border-radius: 4px;
+  color: ${uiColors.yellow} !important;
+  line-height: 1.4;
+
+  &::before {
+    content: '🏷️';
+    padding-right: 6px;
+    font-size: 0.7rem;
+    transform: translateY(-2px);
+    display: inline-block;
+  }
+`;
+
+const GuideLanguage = styled.label`
+  font-size: 0.5rem !important;
+  font-family: 'Press Start 2P', cursive;
+  color: ${uiColors.blue} !important;
+  line-height: 1.4;
+
+  &::before {
+    content: '🌐';
+    padding-right: 6px;
+    font-size: 0.6rem;
+    transform: translateY(-2px);
+    display: inline-block;
+  }
+`;
+
+const GuideLabelsContainer = styled.div`
+  display: flex;
+  justify-content: space-between;
+  padding: 0 6px 6px;
 `;

package/src/mocks/informationCenter.mocks.ts

@@ -3,25 +3,25 @@ import {
   CharacterBuffDurationType,
   CharacterBuffType,
   EntityAttackType,
+  EntityEffectBlueprint,
+  IFaqItem,
+  IInformationCenterItem,
+  IInformationCenterNPC,
   ItemRarities,
   ItemSlotType,
   ItemSubType,
   ItemType,
+  IVideoGuide,
+  LootProbability,
+  MovementSpeed,
   NPCAlignment,
   NPCSubtype,
   RangeTypes,
+  SpellsBlueprint,
+  VideoGuideCategory,
+  VideoGuideLanguage
 } from '@rpg-engine/shared';
-import {
-  IFaqItem,
-  IVideoGuide,
-} from '../components/InformationCenter/InformationCenter';
-import {
-  EntityEffectBlueprint,
-  IInformationCenterItem,
-  IInformationCenterNPC,
-  LootProbability,
-  MovementSpeed,
-} from '../components/InformationCenter/InformationCenterTypes';
+
 
 export const mockBestiaryItems: IInformationCenterNPC[] = [
   {
@@ -34,6 +34,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Standard,
     baseHealth: 5000,
+    isBoss: true,
     skills: {
       level: 300,
       strength: { level: 280 },
@@ -82,6 +83,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Standard,
     baseHealth: 800,
+    isBoss: false,
     skills: {
       level: 85,
       strength: { level: 95 },
@@ -120,6 +122,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Standard,
     baseHealth: 400,
+    isBoss: false,
     skills: {
       level: 45,
       strength: { level: 50 },
@@ -161,6 +164,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Fast,
     baseHealth: 350,
+    isBoss: false,
     skills: {
       level: 40,
       strength: { level: 45 },
@@ -195,6 +199,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Fast,
     baseHealth: 420,
+    isBoss: false,
     skills: {
       level: 50,
       strength: { level: 55 },
@@ -236,6 +241,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Standard,
     baseHealth: 2200,
+    isBoss: false,
     skills: {
       level: 200,
       strength: { level: 160 },
@@ -288,6 +294,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Slow,
     baseHealth: 1800,
+    isBoss: false,
     skills: {
       level: 150,
       strength: { level: 180 },
@@ -333,6 +340,7 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
     maxRangeAttack: RangeTypes.High,
     speed: MovementSpeed.Standard,
     baseHealth: 1200,
+    isBoss: false,
     skills: {
       level: 100,
       strength: { level: 130 },
@@ -368,6 +376,108 @@ export const mockBestiaryItems: IInformationCenterNPC[] = [
       },
     ],
   },
+  {
+    id: '9',
+    name: "Red Deer",
+    subType: NPCSubtype.Animal,
+    key: 'red-deer/up/walking/2.png',
+    alignment: NPCAlignment.Neutral,
+    attackType: EntityAttackType.Melee,
+    maxRangeAttack: RangeTypes.High,
+    speed: MovementSpeed.Standard,
+    isBoss: false,
+    baseHealth: 30,
+    skills: {
+      level: 3,
+      strength: {
+        level: 3,
+      },
+      dexterity: {
+        level: 1,
+      },
+      resistance: {
+        level: 5,
+      },
+    },
+    loots: [
+      {
+        itemBlueprintKey: 'foods/red-meat.png',
+        chance: 30,
+        quantityRange: [1, 4],
+      },
+      {
+        itemBlueprintKey: 'crafting-resources/leather.png',
+        chance: 50,
+        quantityRange: [1, 3],
+      },
+    ],
+    fleeOnLowHealth: false,
+    entityEffects: [],
+    areaSpells: []
+  },
+  {
+    id: '10',
+    name: 'Inferno Widow',
+    key: 'giant-spider/down/standing/0.png',
+    subType: NPCSubtype.Insect,
+    alignment: NPCAlignment.Hostile,
+    attackType: EntityAttackType.MeleeRanged,
+    speed: MovementSpeed.Standard,
+    maxRangeAttack: RangeTypes.High,
+    baseHealth: 60000,
+    isBoss: true,
+    skills: {
+      level: 298,
+      strength: {
+        level: 298,
+      },
+      dexterity: {
+        level: 298,
+      },
+      resistance: {
+        level: 298,
+      }
+    },
+    fleeOnLowHealth: true,
+    loots: [
+      {
+        itemBlueprintKey: 'accessories/gilded-necklace.png',
+        chance: LootProbability.Rare,
+      },
+
+      {
+        itemBlueprintKey: 'armors/golden-armor.png',
+        chance: LootProbability.SemiCommon,
+      }
+    ],
+    entityEffects: [EntityEffectBlueprint.Poison],
+    areaSpells: [
+      {
+        spellKey: SpellsBlueprint.NaturesRevenge,
+        texturePath: 'spell-icons/natures-revenge.png',
+        probability: 10,
+        power: 'High',
+      },
+      {
+        spellKey: SpellsBlueprint.VampiricStorm,
+        texturePath: 'spell-icons/vampiric-storm.png',
+        probability: 50,
+        power: 'High',
+      },
+      {
+        spellKey: SpellsBlueprint.FireStorm,
+        texturePath: 'spell-icons/fire-storm.png',
+        probability: 90,
+        power: 'Medium',
+      },
+      {
+        spellKey: SpellsBlueprint.SelfHealingSpell,
+        texturePath: 'spell-icons/self-healing-spell.png',
+        probability: 90,
+        power: "Hidh",
+      },
+    ],
+  }
 ];
 
 export const mockItems: IInformationCenterItem[] = [
@@ -484,88 +594,89 @@ export const mockTutorials: IVideoGuide[] = [
   {
     id: '1',
     title: 'Getting Started Guide',
-    description:
-      'Learn the basics of character creation, movement, and basic combat.',
-    thumbnailUrl: '/tutorials/getting-started.jpg',
-    videoUrl: 'https://youtube.com/watch?v=getting-started',
-    category: 'General',
+    description: 'Learn the basics of character creation, movement, and basic combat.',
+    videoUrl: 'https://youtu.be/_8d7e-otQoo',
+    category: VideoGuideCategory.General,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '2',
     title: 'Advanced Combat Techniques',
-    description:
-      'Master the art of combat with advanced combos and spell casting.',
-    thumbnailUrl: '/tutorials/advanced-combat.jpg',
-    videoUrl: 'https://youtube.com/watch?v=advanced-combat',
-    category: 'Combat',
+    description: 'Master the art of combat with advanced combos and spell casting.',
+    videoUrl: 'https://youtu.be/7LQlyy0Y720?si=wZ79VC4sCsI781Mn',
+    category: VideoGuideCategory.Combat,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '3',
     title: 'Crafting System Tutorial',
-    description:
-      'Everything you need to know about crafting weapons and items.',
-    thumbnailUrl: '/tutorials/crafting.jpg',
+    description: 'Everything you need to know about crafting weapons and items.',
+    localImage: 'https://youtube.com/watch?v=crafting',
     videoUrl: 'https://youtube.com/watch?v=crafting',
-    category: 'Crafting',
+    category: VideoGuideCategory.Crafting,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '4',
     title: 'Secret Areas Guide',
     description: 'Discover hidden locations and treasures across the world.',
-    thumbnailUrl: '/tutorials/exploration.jpg',
+    localImage: 'https://youtube.com/watch?v=exploration',
     videoUrl: 'https://youtube.com/watch?v=exploration',
-    category: 'Exploration',
+    category: VideoGuideCategory.Exploration,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '5',
     title: 'Boss Battle Strategies',
-    description:
-      'Learn effective strategies to defeat challenging boss encounters.',
-    thumbnailUrl: '/tutorials/boss-battles.jpg',
+    description: 'Learn effective strategies to defeat challenging boss encounters.',
+    localImage: 'https://youtube.com/watch?v=boss-battles',
     videoUrl: 'https://youtube.com/watch?v=boss-battles',
-    category: 'Combat',
+    category: VideoGuideCategory.Combat,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '6',
     title: 'Resource Gathering Guide',
-    description:
-      'Efficient methods for gathering crafting materials and resources.',
-    thumbnailUrl: '/tutorials/resource-gathering.jpg',
+    description: 'Efficient methods for gathering crafting materials and resources.',
+    localImage: 'https://youtube.com/watch?v=resource-gathering',
     videoUrl: 'https://youtube.com/watch?v=resource-gathering',
-    category: 'Crafting',
+    category: VideoGuideCategory.Crafting,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '7',
     title: 'Dungeon Exploration Tips',
-    description:
-      'Essential tips for surviving and navigating dangerous dungeons.',
-    thumbnailUrl: '/tutorials/dungeon-tips.jpg',
+    description: 'Essential tips for surviving and navigating dangerous dungeons.',
+    localImage: 'https://youtube.com/watch?v=dungeon-tips',
     videoUrl: 'https://youtube.com/watch?v=dungeon-tips',
-    category: 'Exploration',
+    category: VideoGuideCategory.Exploration,
+    language: VideoGuideLanguage.English,
   },
   {
     id: '8',
     title: 'Character Build Guide',
     description: 'Optimize your character builds for different playstyles.',
-    thumbnailUrl: '/tutorials/character-builds.jpg',
+    localImage: 'https://youtube.com/watch?v=character-builds',
     videoUrl: 'https://youtube.com/watch?v=character-builds',
-    category: 'General',
+    category: VideoGuideCategory.General,
+    language: VideoGuideLanguage.Portuguese,
   },
   {
     id: '9',
     title: 'PvP Combat Guide',
     description: 'Advanced tactics for player versus player combat scenarios.',
-    thumbnailUrl: '/tutorials/pvp-combat.jpg',
+    localImage: 'https://youtube.com/watch?v=pvp-combat',
     videoUrl: 'https://youtube.com/watch?v=pvp-combat',
-    category: 'Combat',
+    category: VideoGuideCategory.Combat,
+    language: VideoGuideLanguage.Portuguese,
   },
   {
     id: '10',
     title: 'Rare Item Crafting',
-    description:
-      'Special recipes and techniques for crafting rare and legendary items.',
-    thumbnailUrl: '/tutorials/rare-crafting.jpg',
+    description: 'Special recipes and techniques for crafting rare and legendary items.',
+    localImage: 'https://youtube.com/watch?v=rare-crafting',
     videoUrl: 'https://youtube.com/watch?v=rare-crafting',
-    category: 'Crafting',
+    category: VideoGuideCategory.Crafting,
+    language: VideoGuideLanguage.Portuguese,
   },
 ];

package/src/stories/UI/info/InformationCenter.stories.tsx

@@ -1,7 +1,6 @@
 import type { Meta, Story } from '@storybook/react';
 import React from 'react';
 import { InformationCenter } from '../../../components/InformationCenter/InformationCenter';
-import { IInformationCenterItem } from '../../../components/InformationCenter/InformationCenterTypes';
 import { RPGUIRoot } from '../../../components/RPGUI/RPGUIRoot';
 import entitiesAtlasJSON from '../../../mocks/atlas/entities/entities.json';
 import entitiesAtlasIMG from '../../../mocks/atlas/entities/entities.png';
@@ -10,6 +9,7 @@ import iconsAtlasIMG from '../../../mocks/atlas/icons/icons.png';
 import itemsAtlasJSON from '../../../mocks/atlas/items/items.json';
 import itemsAtlasIMG from '../../../mocks/atlas/items/items.png';
 
+import { IInformationCenterItem } from '@rpg-engine/shared';
 import { mockBestiaryItems, mockFaqItems, mockItems, mockTutorials } from '../../../mocks/informationCenter.mocks';
  
 

package/dist/components/InformationCenter/InformationCenterTypes.d.ts

@@ -1,96 +0,0 @@
-import { EntityAttackType, ICharacterPermanentBuff, IEquippableItemBlueprint, INPCLoot, ItemRarities, NPCAlignment, NPCSubtype, RangeTypes } from '@rpg-engine/shared';
-import { IFaqItem, IVideoGuide } from './InformationCenter';
-export declare enum MovementSpeed {
-    ExtraSlow = 1.5,
-    Slow = 2.25,
-    Standard = 2.6,
-    Fast = 3,
-    ExtraFast = 3.5
-}
-export declare enum EntityEffectBlueprint {
-    Poison = "poison",
-    Bleeding = "bleeding",
-    Freezing = "freezing",
-    Burning = "burning",
-    Corruption = "corruption",
-    VineGrasp = "vine-grasp",
-    Curse = "curse",
-    Drain = "drain",
-    Shadow = "shadow",
-    Stun = "stun",
-    Knockback = "knockback",
-    Rage = "rage",
-    Weakness = "weakness",
-    Cripple = "cripple",
-    Regeneration = "regeneration"
-}
-export declare enum LootProbability {
-    VeryRare = 0.5,
-    Rare = 1,
-    Uncommon = 10,
-    SemiCommon = 15,
-    Common = 20,
-    VeryCommon = 35
-}
-interface INPCBlueprintSpellArea {
-    spellKey: string;
-    probability: number;
-    power: string;
-    texturePath: string;
-}
-export interface IInformationCenterNPC {
-    id: string;
-    name: string;
-    key: string;
-    subType: NPCSubtype;
-    alignment: NPCAlignment;
-    attackType: EntityAttackType;
-    maxRangeAttack: RangeTypes;
-    speed: MovementSpeed;
-    baseHealth: number;
-    skills: {
-        level: number;
-        strength?: {
-            level: number;
-        };
-        dexterity?: {
-            level: number;
-        };
-        resistance?: {
-            level: number;
-        };
-    };
-    fleeOnLowHealth: boolean;
-    entityEffects: EntityEffectBlueprint[];
-    areaSpells: INPCBlueprintSpellArea[];
-    loots: INPCLoot[];
-}
-export interface IInformationCenterItem extends IEquippableItemBlueprint {
-    tier: number;
-    rarity: ItemRarities;
-    rangeType?: EntityAttackType;
-    basePrice: number;
-    canSell: boolean;
-    maxStackSize: number;
-    usableEffectDescription?: string;
-    entityEffects?: [EntityEffectBlueprint];
-    entityEffectChance?: number;
-    equippedBuff?: ICharacterPermanentBuff[];
-    equippedBuffDescription?: string;
-}
-export interface IInformationCenterProps {
-    itemsAtlasJSON: Record<string, any>;
-    itemsAtlasIMG: string;
-    entitiesAtlasJSON: Record<string, any>;
-    entitiesAtlasIMG: string;
-    iconsAtlasJSON: any;
-    iconsAtlasIMG: any;
-    faqItems?: IFaqItem[];
-    bestiaryItems?: IInformationCenterNPC[];
-    videoGuides?: IVideoGuide[];
-    items?: IInformationCenterItem[];
-    loading?: boolean;
-    error?: string;
-    initialSearchQuery?: string;
-}
-export {};