Revert "Assets Typing (#3051)"

This reverts commit 83ff9a6.

Author: nitzanyiz

demo/src/assets/Assets.ts

@@ -1,7 +1,30 @@
-import {Colors, Typography, Spacings, TextField} from 'react-native-ui-lib'; // eslint-disable-line
+import {Assets, Colors, Typography, Spacings, Incubator} from 'react-native-ui-lib'; // eslint-disable-line
 
 export const loadDemoConfigurations = () => {
-  require('./assets/Assets');
+  Assets.loadAssetsGroup('icons.demo', {
+    chevronDown: require('./assets/icons/chevronDown.png'),
+    chevronRight: require('./assets/icons/chevronRight.png'),
+    add: require('./assets/icons/add.png'),
+    camera: require('./assets/icons/cameraSelected.png'),
+    close: require('./assets/icons/close.png'),
+    dashboard: require('./assets/icons/dashboard.png'),
+    drag: require('./assets/icons/drag.png'),
+    image: require('./assets/icons/image.png'),
+    plus: require('./assets/icons/plus.png'),
+    refresh: require('./assets/icons/refresh.png'),
+    search: require('./assets/icons/search.png'),
+    settings: require('./assets/icons/settings.png'),
+    share: require('./assets/icons/share.png')
+  });
+
+  Assets.loadAssetsGroup('images.demo', {
+    brokenImage: require('./assets/images/placeholderMissingImage.png')
+  });
+
+  Assets.loadAssetsGroup('svgs.demo', {
+    logo: require('./assets/svgs/headerLogo.svg').default
+  });
+
   Typography.loadTypographies({
     h1: {...Typography.text40},
     h2: {...Typography.text50},

demo/src/configurations.js

@@ -1,9 +1,8 @@
 import React, {Component} from 'react';
 import {StyleSheet, ScrollView, LayoutAnimation} from 'react-native';
-import {Colors, Typography, View, Drawer, Text, Button, Avatar, Badge, DrawerProps} from 'react-native-ui-lib';
+import {Assets, Colors, Typography, View, Drawer, Text, Button, Avatar, Badge, DrawerProps} from 'react-native-ui-lib';
 import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
 import conversations from '../../data/conversations';
-import Assets from '../../assets/Assets';
 
 import {renderBooleanOption, renderSliderOption, renderColorOption} from '../ExampleScreenPresenter';
 

demo/src/screens/componentScreens/DrawerScreen.tsx

@@ -1,9 +1,8 @@
 import _ from 'lodash';
 import React, {Component} from 'react';
 import {Alert, ViewStyle} from 'react-native';
-import {Colors, View, Text, Hint, Button, Incubator} from 'react-native-ui-lib';
+import {Colors, View, Text, Hint, Button, Assets, Incubator} from 'react-native-ui-lib';
 import {renderMultipleSegmentOptions, renderBooleanOption} from '../ExampleScreenPresenter';
-import Assets from '../../assets/Assets';
 
 const settingsIcon = require('../../assets/icons/settings.png');
 const reactions = ['❤️', '😮', '😔', '😂', '😡'];

demo/src/screens/componentScreens/HintsScreen.tsx

@@ -1,8 +1,7 @@
 import React, {Component} from 'react';
 import {ScrollView} from 'react-native';
-import {View, Text, Icon, Image, Colors, OverlayTypes} from 'react-native-ui-lib';
+import {View, Text, Icon, Image, Colors, Assets, OverlayTypes} from 'react-native-ui-lib';
 import {renderBooleanOption, renderRadioGroup, renderSliderOption} from '../ExampleScreenPresenter';
-import Assets from '../../assets/Assets';
 
 const IMAGE_URL =
   'https://images.pexels.com/photos/748837/pexels-photo-748837.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260';

demo/src/screens/componentScreens/ImageScreen.tsx

@@ -1,8 +1,7 @@
 import React, {Component} from 'react';
 import {Alert, StyleSheet} from 'react-native';
 import {Navigation} from 'react-native-navigation';
-import {Colors, Carousel, PageControl, Modal, View, Text} from 'react-native-ui-lib'; // eslint-disable-line
-import Assets from '../../assets/Assets';
+import {Colors, Carousel, PageControl, Modal, View, Text, Assets} from 'react-native-ui-lib'; // eslint-disable-line
 
 const BUTTONS_HIT_SLOP = {right: 5, left: 5, top: 10, bottom: 10};
 interface ModalScreenProps {

demo/src/screens/componentScreens/ModalScreen.tsx

@@ -8,10 +8,10 @@ import {
   TouchableOpacity,
   Text,
   Icon,
+  Assets,
   Colors,
   Button
 } from 'react-native-ui-lib';
-import Assets from '../../assets/Assets';
 import {renderHeader} from '../ExampleScreenPresenter';
 
 interface Item extends SortableListItemProps {

demo/src/screens/componentScreens/SortableListScreen.tsx

@@ -2,6 +2,7 @@ import _ from 'lodash';
 import React, {Component} from 'react';
 import {ActivityIndicator, StyleSheet} from 'react-native';
 import {
+  Assets,
   TabController,
   Colors,
   View,
@@ -11,7 +12,6 @@ import {
   TabControllerImperativeMethods
 } from 'react-native-ui-lib';
 import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
-import Assets from '../../../assets/Assets';
 
 import Tab1 from './tab1';
 import Tab2 from './tab2';

demo/src/screens/componentScreens/TabControllerScreen/index.tsx

@@ -11,9 +11,9 @@ import {
   TextFieldRef,
   FieldContextType,
   TextFieldProps,
-  SegmentedControl
+  SegmentedControl,
+  Assets
 } from 'react-native-ui-lib';
-import Assets from '../../assets/Assets';
 const {KeyboardAwareInsetsView} = Keyboard;
 const priceFormatter = Intl.NumberFormat('en-US');
 const validationIcon = require('../../assets/icons/exclamationFillSmall.png');

demo/src/screens/componentScreens/TextFieldScreen.tsx

@@ -1,7 +1,7 @@
 import React, {useCallback, useRef, useState} from 'react';
 import {StyleSheet, ScrollView} from 'react-native';
-import {Colors, Timeline, View, Card, Text, Button} from 'react-native-ui-lib';
-import Assets from '../../assets/Assets';
+import {Assets, Colors, Timeline, View, Card, Text, Button} from 'react-native-ui-lib';
+
 const contents = [
   'CURRENT (default) state with dashed line.\nAligned to title',
   'SUCCESS state with label.',

demo/src/screens/componentScreens/TimelineScreen.tsx

@@ -1,9 +1,9 @@
 import React, {Component} from 'react';
 import {ScrollView, StyleSheet} from 'react-native';
-import {Colors, View, Button, Text, Incubator} from 'react-native-ui-lib';
+import {Assets, Colors, View, Button, Text, Incubator} from 'react-native-ui-lib';
 import {renderMultipleSegmentOptions, renderBooleanOption, renderRadioGroup} from '../ExampleScreenPresenter';
 import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
-import Assets from '../../assets/Assets';
+
 const {Toast} = Incubator;
 
 const TOAST_ACTIONS = {

demo/src/screens/incubatorScreens/IncubatorToastScreen.tsx

@@ -2,6 +2,7 @@ import React, {Component} from 'react';
 import {StyleSheet, ScrollView} from 'react-native';
 import {GestureHandlerRootView, FlatList} from 'react-native-gesture-handler';
 import {
+  Assets,
   View,
   Text,
   Colors,
@@ -14,7 +15,7 @@ import {
   TouchableOpacity
 } from 'react-native-ui-lib';
 const {PanView} = Incubator;
-import Assets from '../../assets/Assets';
+
 interface Item {
   value: string;
   label: string;

demo/src/screens/incubatorScreens/PanViewScreen.tsx

@@ -1,8 +1,7 @@
 import React, {Component} from 'react';
 import {StyleSheet, ScrollView} from 'react-native';
-import {Colors, Spacings, View, Card, Text, Image, Button, Constants} from 'react-native-ui-lib';
+import {Assets, Colors, Spacings, View, Card, Text, Image, Button, Constants} from 'react-native-ui-lib';
 import _ from 'lodash';
-import Assets from '../../../assets/Assets';
 
 import './configurations';
 

demo/src/screens/realExamples/Pinterest/index.tsx

@@ -1,8 +1,7 @@
 import React, {Component} from 'react';
 import {ScrollView} from 'react-native';
-import {View, Text, Icon, Colors, Image, Button, Carousel, Picker, PickerValue} from 'react-native-ui-lib';
+import {Assets, View, Text, Icon, Colors, Image, Button, Carousel, Picker, PickerValue} from 'react-native-ui-lib';
 import _ from 'lodash';
-import Assets from '../../../assets/Assets';
 
 const colorOptions = [
   {label: 'Red', value: 'red', color: Colors.red30},

demo/src/screens/realExamples/ProductPage/index.tsx

@@ -1,5 +1,4 @@
 import _ from 'lodash';
-import type {AssetRecord} from '../typings/assets';
 
 interface CustomObject {
   [key: string]: any;
@@ -42,7 +41,7 @@ function ensurePath(obj: CustomObject, path: string) {
 export class Assets {
   [key: string]: any;
 
-  loadAssetsGroup<T extends string, K extends object>(groupName: T, assets: K): asserts this is AssetRecord<typeof this, T, K> {
+  loadAssetsGroup(groupName: string, assets: object) {
     if (!_.isString(groupName)) {
       throw new Error('group name should be a string');
     }
@@ -56,6 +55,8 @@ export class Assets {
     } else {
       assignProperties(ensurePath(this, groupName), assets);
     }
+
+    return this;
   }
 
   getAssetByPath(path: string) {

src/assets/Assets.ts

@@ -8,7 +8,7 @@ describe('Assets', () => {
   });
 
   describe('.loadAssetsGroup(groupName, assets)', () => {
-    it.skip('should return the assets object itself', () => {
+    it('should return the assets object itself', () => {
       expect(assets.loadAssetsGroup('emojis', {})).toBe(assets);
     });
 

src/assets/__tests__/Assets.spec.js

@@ -1342,5 +1342,5 @@ export const emojis = {
   "woman-woman-girl-girl": "👩‍👩‍👧‍👧",
   "woman-heart-woman": "👩‍❤️‍👩",
   "woman-kiss-woman": "👩‍❤️‍💋‍👩"
-} as const;
+}
 

src/assets/emojis/index.ts renamed to src/assets/emojis/index.js

@@ -1,20 +1,13 @@
 import {Assets} from './Assets';
-import type {icons} from './icons';
-import type {emojis} from './emojis';
-import type {images} from './images';
 
-
-const assets: Assets = new Assets();
-assets.loadAssetsGroup('', {
-  get icons(): typeof icons {
+export default new Assets().loadAssetsGroup('', {
+  get icons() {
     return require('./icons').icons;
   },
-  get emojis(): typeof emojis {
+  get emojis() {
     return require('./emojis').emojis;
   },
-  get images(): typeof images {
+  get images() {
     return require('./images').images;
   }
 });
-const ExportedAssets: typeof assets = assets;
-export default ExportedAssets;