@ledvance/ui-biz-bundle 1.0.0

package/.babelrc

@@ -0,0 +1,31 @@
+{
+  "presets": ["module:metro-react-native-babel-preset"],
+  "plugins": [
+    ["@babel/plugin-proposal-decorators", { "legacy": true }],
+    ["module-resolver", {
+      "cwd": "babelrc",
+      "root": ["./src"],
+      "extensions": [
+        ".ts",
+        ".tsx",
+        ".js",
+        ".jsx",
+        ".json"
+      ],
+      "alias": {
+        "@api": "./src/api",
+        "@components": "./src/components",
+        "@config": "./src/config",
+        "@i18n": "./src/i18n",
+        "@models": "./src/models",
+        "@res": "./src/res",
+        "@utils": "./src/utils"
+      }
+    }]
+  ],
+  "env": {
+    "production": {
+      "plugins": ["transform-remove-console"]
+    }
+  }
+}

package/.eslintignore

@@ -0,0 +1,6 @@
+node_modules
+__tests__
+src
+index.js
+index.ios.js
+index.android.js

package/.eslintrc.js

@@ -0,0 +1,27 @@
+const path = require('path');
+
+module.exports = {
+  root: true,
+  extends: ['tuya/react-native'],
+  rules: {
+    'one-var': 0,
+    '@typescript-eslint/no-unused-vars': 0,
+    'react/jsx-props-no-spreading': 0,
+  },
+  settings: {
+    'import/resolver': {
+      alias: {
+        map: [
+          ['@api', path.resolve(__dirname, './src/api')],
+          ['@components', path.resolve(__dirname, './src/components')],
+          ['@config', path.resolve(__dirname, './src/config')],
+          ['@i18n', path.resolve(__dirname, './src/i18n')],
+          ['@models', path.resolve(__dirname, './src/models')],
+          ['@res', path.resolve(__dirname, './src/res')],
+          ['@utils', path.resolve(__dirname, './src/utils')],
+        ],
+        extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'],
+      },
+    },
+  },
+};

package/.prettierrc.js

@@ -0,0 +1 @@
+module.exports = require('eslint-config-tuya/.prettierrc.js');

package/.versionrc

@@ -0,0 +1,5 @@
+{
+  "commitUrlFormat": "https://github.com/tuya/tuya-panel-demo/commit/{{hash}}",
+  "releaseCommitMessageFormat": "chore(release): @template/basic-ts-navigation {{currentTag}}",
+  "path": "."
+}

package/package.json

@@ -0,0 +1,72 @@
+{
+  "rnVersion": "5.30",
+  "license": "MIT",
+  "name": "@ledvance/ui-biz-bundle",
+  "pid": [],
+  "uiid": "",
+  "version": "1.0.0",
+  "scripts": {},
+  "dependencies": {
+    "@ledvance/base": "^1.x",
+    "@reduxjs/toolkit": "^1.8.6",
+    "@tuya/tuya-panel-api": "^1.12.0",
+    "ahooks": "^2.x",
+    "buffer": "^6.0.3",
+    "dayjs": "^1.11.5",
+    "events": "^1.1.1",
+    "lodash": "^4.17.19",
+    "moment": "^2.20.1",
+    "prop-types": "^15.6.1",
+    "react": "16.8.3",
+    "react-addons-shallow-compare": "^15.6.2",
+    "react-native": "0.59.10",
+    "react-native-render-html": "^6.3.4",
+    "react-native-svg": "5.5.1",
+    "react-redux": "^7.2.1",
+    "redux": "^4.0.0",
+    "redux-actions": "^2.6.1",
+    "redux-logger": "^3.0.6",
+    "redux-observable": "^1.0.0",
+    "redux-thunk": "^2.3.0",
+    "rxjs": "^6.3.1",
+    "rxjs-compat": "^6.3.1",
+    "style-equal": "^1.0.0",
+    "tuya-panel-kit": "^4.9.4"
+  },
+  "devDependencies": {
+    "@babel/plugin-proposal-decorators": "^7.12.1",
+    "@commitlint/cli": "^11.0.0",
+    "@tuya/tuya-panel-patches": "^0.59.10",
+    "@types/lodash": "^4.14.137",
+    "@types/react": "^16.0.4",
+    "@types/react-native": "^0.60.0",
+    "@types/react-redux": "^7.1.2",
+    "@types/redux": "^3.6.0",
+    "@types/redux-actions": "^2.6.1",
+    "@types/redux-logger": "^3.0.7",
+    "@types/tuya-panel-kit": "^4.7.3",
+    "babel-jest": "^22.1.0",
+    "babel-plugin-import": "^1.11.0",
+    "babel-plugin-module-resolver": "^4.0.0",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-plugin-transform-remove-console": "^6.9.4",
+    "commitizen": "^4.2.2",
+    "commitlint-config-cz": "^0.13.2",
+    "cz-customizable": "^6.3.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-config-tuya": "^1.0.0",
+    "eslint-import-resolver-alias": "^1.1.2",
+    "eslint-import-resolver-react-native": "^0.2.0",
+    "eslint-plugin-react-native": "^3.10.0",
+    "husky": "^4.3.0",
+    "jest": "^22.1.1",
+    "metro-react-native-babel-preset": "^0.63.0",
+    "react-native-typescript-transformer": "^1.2.13",
+    "react-test-renderer": "^16.2.0",
+    "standard-version": "^9.0.0",
+    "typescript": "^4.1.2"
+  },
+  "jest": {
+    "preset": "react-native"
+  }
+}

package/rn-cli.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  getTransformModulePath() {
+    return require.resolve('react-native-typescript-transformer');
+  },
+  getSourceExts() {
+    return ['ts', 'tsx'];
+  },
+};

package/src/modules/history/HistoryPage.d.ts

@@ -0,0 +1,2 @@
+declare const SwitchHistoryPage: () => JSX.Element;
+export default SwitchHistoryPage;

package/src/modules/history/HistoryPage.tsx

@@ -0,0 +1,255 @@
+import Page from '@ledvance/base/src/components/Page'
+import {useDeviceInfo} from '@ledvance/base/src/models/modules/NativePropsSlice'
+import React, {useCallback, useEffect} from 'react'
+import I18n from '@ledvance/base/src/i18n'
+import {getSwitchHistoryData, SwitchHistoryUIItemData} from './SwitchHistoryPageActions'
+import res from '@ledvance/base/src/res'
+import {Utils} from 'tuya-panel-kit'
+import {useReactive} from 'ahooks'
+import {FlatList, Image, StyleSheet, Text, View} from 'react-native'
+import Spacer from '@ledvance/base/src/components/Spacer'
+import {RouteProp, useRoute} from '@react-navigation/core'
+import { isEmpty } from 'lodash'
+import Tag from "@ledvance/base/src/components/Tag"
+
+const cx = Utils.RatioUtils.convertX
+
+type SwitchHistoryPageRouteParams = {
+    params: { dpIds: string[], tags?: object }
+}
+
+type Props = {
+    route: RouteProp<SwitchHistoryPageRouteParams, 'params'>
+}
+
+const SwitchHistoryPage = () => {
+    const deviceInfo = useDeviceInfo()
+    const { dpIds, tags } = useRoute<Props['route']>().params
+
+    const state = useReactive<SwitchHistoryPageState>({
+        refreshing: true,
+        refreshType: 'refresh',
+        onRefresh: Symbol(),
+        data: [],
+        dataOffset: 0,
+        hasNext: true,
+        filterTags: tags ? Object.keys(tags).reduce((pre, cur)=> {
+            pre[cur] = false
+            return pre
+        }, {}) : {}
+    })
+
+    const loadData: (refreshType: RefreshType) => void = useCallback(async refreshType => {
+        state.refreshType = refreshType
+        if (state.refreshType === 'refresh') {
+            state.dataOffset = 0
+            state.onRefresh = Symbol()
+        } else if (state.hasNext) {
+            state.onRefresh = Symbol()
+        }
+    }, [])
+
+    const changeFilter = useCallback((v:boolean, tag: string) =>{
+        state.filterTags = {
+            ...state.filterTags,
+            [tag]: v
+        }
+    }, [])
+
+    const getRequestIds = useCallback(() =>{
+        const tagValue = Object.values(state.filterTags)
+        const isAllData = tagValue.every(tag => tag) || tagValue.every(tag => !tag)
+        const checkedTags = Object.keys(state.filterTags).reduce((pre:string[], cur) => {
+            if(state.filterTags[cur]) pre.push(cur)
+            return pre
+        }, [])
+        return isAllData ? dpIds : checkedTags
+    }, [state.filterTags])
+
+
+    useEffect(() => {
+        getSwitchHistoryData(deviceInfo.devId, getRequestIds(), state.dataOffset)
+            .then(res => {
+                state.refreshing = false
+                state.data = res.data
+                state.dataOffset = res.currentOffset
+                state.hasNext = res.hasNext
+            })
+    }, [state.onRefresh, state.filterTags])
+
+    return (
+        <Page
+            backText={deviceInfo.name}
+            headlineText={I18n.getLang('history_socket_headline_text')}
+            headlineIcon={res.rn_ic_download}>
+            <View style={styles.content}>
+                <Text style={styles.titleText}>{I18n.getLang('history_contact_sensor_description_text')}</Text>
+                <Spacer/>
+                {!isEmpty(state.filterTags) && !!state.data.length &&
+                    <View style={{
+                        display: 'flex',
+                        flexDirection: 'row',
+                        flexWrap: 'wrap',
+                        marginHorizontal: cx(24),
+                        marginBottom: cx(12),
+                        alignSelf: 'flex-start'
+                    }}>
+                        {
+                            Object.keys(state.filterTags)?.map((tag) => {
+                                return <Tag
+                                    key={tag}
+                                    text={tags && tags[tag]}
+                                    checked={state.filterTags[tag]}
+                                    onCheckedChange={(v) => changeFilter(v, tag)}
+                                    style={{ marginTop: cx(5), marginHorizontal: cx(5) }}
+                                />
+                            })
+                        }
+                    </View>
+                }
+                <FlatList
+                    data={state.data}
+                    style={styles.list}
+                    renderItem={({item}) => <SwitchHistoryItem {...{itemData :item, tags}}/>}
+                    keyExtractor={(_, index) => `${index}`}
+                    ListFooterComponent={<Spacer/>}
+                    ListEmptyComponent={(
+                        <View style={styles.listEmptyView}>
+                            <Spacer height={cx(26)}/>
+                            <Image
+                                style={styles.listEmptyImage}
+                                source={{uri: res.ldv_timer_empty}}/>
+                            <Spacer height={cx(14)}/>
+                            <View style={{flexDirection: 'row', alignItems: 'center'}}>
+                                <Image style={styles.listEmptyTextIcon} source={{uri: res.ic_info}}/>
+                                <Spacer width={cx(4)} height={0}/>
+                                <Text style={styles.listEmptyText}>{I18n.getLang('history_overview_empty_information_text')}</Text>
+                            </View>
+                        </View>
+                    )}
+                    refreshing={state.refreshing}
+                    onEndReachedThreshold={.1}
+                    onRefresh={async () => {
+                        await loadData('refresh')
+                    }}
+                    onEndReached={async () => {
+                        await loadData('loadMore')
+                    }}/>
+            </View>
+        </Page>
+    )
+}
+
+interface SwitchHistoryItemBean {
+    itemData: SwitchHistoryUIItemData
+    tags?: object
+}
+
+const SwitchHistoryItem = (props: SwitchHistoryItemBean)  => {
+    const { itemData, tags} = props
+    return (
+        <View style={styles.switchHistoryItem}>
+            <Text style={styles.switchHistoryItemTitle}>{itemData.title}</Text>
+            <Spacer height={cx(10)}/>
+            {itemData.actions.map((actionData, index) => (
+                <View style={styles.switchHistoryItemActionItem} key={`${index}`}>
+                    <View style={styles.switchHistoryItemActionItemLineGroup}>
+                        <View style={styles.switchHistoryItemActionItemLine}/>
+                        <View style={styles.switchHistoryItemActionItemPoint}/>
+                        <View style={styles.switchHistoryItemActionItemLine}/>
+                    </View>
+                    <Spacer width={cx(20)} height={0}/>
+                    <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.time}`}</Text>
+                    <Spacer width={cx(20)} height={0}/>
+                    <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.action}`}</Text>
+                    {!!tags && <Text style={styles.switchHistoryItemTag}>{tags[actionData.dpId]}</Text>}
+                </View>
+            ))}
+            <Spacer/>
+        </View>
+    )
+}
+
+const styles = StyleSheet.create({
+    content: {
+        flex: 1,
+    },
+    list: {
+        flex: 1,
+    },
+    listEmptyView: {
+        alignItems: 'center',
+    },
+    listEmptyImage: {
+        width: cx(200),
+        height: cx(200),
+    },
+    listEmptyTextIcon: {
+        width: cx(16),
+        height: cx(16),
+        tintColor: '#000',
+    },
+    listEmptyText: {
+        color: '#000',
+        fontSize: cx(12),
+        fontFamily: 'helvetica_neue_lt_std_roman',
+    },
+    titleText: {
+        marginHorizontal: cx(24),
+        color: '#000',
+        fontSize: cx(16),
+        fontFamily: 'helvetica_neue_lt_std_roman',
+    },
+    switchHistoryItem: {
+        marginHorizontal: cx(24),
+    },
+    switchHistoryItemTitle: {
+        color: '#000',
+        fontSize: cx(18),
+        fontFamily: 'helvetica_neue_lt_std_bd',
+    },
+    switchHistoryItemActionItem: {
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    switchHistoryItemActionItemLineGroup: {
+        alignItems: 'center',
+    },
+    switchHistoryItemActionItemLine: {
+        width: cx(1),
+        height: cx(11.5),
+        backgroundColor: '#E6E7E8',
+    },
+    switchHistoryItemActionItemPoint: {
+        width: cx(7),
+        height: cx(7),
+        backgroundColor: '#f60',
+        borderRadius: cx(4),
+    },
+    switchHistoryItemActionItemText: {
+        color: '#000',
+        fontSize: cx(16),
+        fontFamily: 'helvetica_neue_lt_std_roman',
+    },
+    switchHistoryItemTag:{
+        paddingHorizontal: cx(10),
+        borderRadius: cx(10),
+        backgroundColor: '#cbcbcb',
+        marginLeft: cx(5)
+    }
+})
+
+export default SwitchHistoryPage
+
+type RefreshType = 'refresh' | 'loadMore'
+
+
+interface SwitchHistoryPageState {
+    refreshing: boolean
+    refreshType: RefreshType
+    onRefresh: symbol
+    data: SwitchHistoryUIItemData[]
+    hasNext: boolean
+    dataOffset: number
+    filterTags: object
+}

package/src/modules/history/SwitchHistoryPageActions.d.ts

@@ -0,0 +1,13 @@
+import { PagingResult } from '@ledvance/base/src/models/TuyaApi';
+export interface SwitchHistoryUIItemData {
+    title: string;
+    actions: SwitchHistoryUIItemActionData[];
+}
+export interface SwitchHistoryUIItemActionData {
+    date: string;
+    time: string;
+    action: string;
+}
+declare type getSwitchHistoryDataFunType = (deviceId: string, dpIds: string[], offset: number, limit?: number) => Promise<PagingResult<SwitchHistoryUIItemData[]>>;
+export declare const getSwitchHistoryData: getSwitchHistoryDataFunType;
+export {};

package/src/modules/history/SwitchHistoryPageActions.ts

@@ -0,0 +1,54 @@
+import { getDpReportSataData, PagingResult } from '@ledvance/base/src/models/TuyaApi'
+import { groupBy, isEqual, uniqWith } from 'lodash'
+import dayjs from 'dayjs'
+import I18n from '@ledvance/base/src/i18n'
+export interface SwitchHistoryUIItemData {
+    title: string
+    actions: SwitchHistoryUIItemActionData[]
+}
+
+const weekList = {
+    Sun: I18n.getLang('timeschedule_add_schedule_weekday7_text'),
+    Mon: I18n.getLang('timeschedule_add_schedule_weekday1_text'),
+    Tue: I18n.getLang('timeschedule_add_schedule_weekday2_text'),
+    Wed: I18n.getLang('timeschedule_add_schedule_weekday3_text'),
+    Thu: I18n.getLang('timeschedule_add_schedule_weekday4_text'),
+    Fri: I18n.getLang('timeschedule_add_schedule_weekday5_text'),
+    Sat: I18n.getLang('timeschedule_add_schedule_weekday6_text'),
+}
+
+export interface SwitchHistoryUIItemActionData {
+    date: string
+    time: string
+    action: string
+    dpId: string
+}
+
+type getSwitchHistoryDataFunType = (deviceId: string, dpIds: string[], offset: number, limit?: number) => Promise<PagingResult<SwitchHistoryUIItemData[]>>
+
+export const getSwitchHistoryData: getSwitchHistoryDataFunType = async (deviceId: string, dpIds: string[], offset: number, limit: number = 100) => {
+    const res = await getDpReportSataData(deviceId, dpIds, 0, offset + limit)
+    const uniqData = uniqWith(res.dps, isEqual)
+    const dateActionsMap = groupBy(uniqData.map(dpData => {
+        const dayjsDate = dayjs(dpData.timeStr)
+        return {
+            date: `${dayjsDate.format('DD/MM/YYYY')} (${weekList[dayjsDate.format('ddd')]})`,
+            time: dayjsDate.format('HH:mm:ss'),
+            action: I18n.formatValue(dpData.value === 'true' ? 'history_powerstrip_field1_text' : 'history_powerstrip_field1_text2', '', ''),
+            dpId: dpData.dpId,
+        }
+    }), 'date')
+    const data: SwitchHistoryUIItemData[] = Object.keys(dateActionsMap).map(key => {
+        return {
+            title: key,
+            actions: dateActionsMap[key],
+        }
+    })
+    const result: PagingResult<SwitchHistoryUIItemData[]> = {
+        data: data,
+        hasNext: res.hasNext,
+        currentOffset: res.dps.length,
+    }
+    console.log(result)
+    return result
+}

package/tsconfig.json

@@ -0,0 +1,51 @@
+{
+    "compilerOptions": {
+        /* Basic Options */
+        "target": "ES2017",
+        /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
+        "module": "commonjs",
+        /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
+        "jsx": "react",
+        /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+
+        /* Strict Type-Checking Options */
+        /* "strict": true                         /* Enable all strict type-checking options. */
+        "noImplicitAny": false,
+        /* Raise error on expressions and declarations with an implied 'any' type. */
+        "strictNullChecks": true,
+        /* Enable strict null checks. */
+
+        /* Additional Checks */
+        "noUnusedLocals": true,
+        /* Report errors on unused locals. */
+        "noUnusedParameters": true,
+        /* Report errors on unused parameters. */
+
+        /* .d.ts config */
+        "declaration": true,
+        "emitDeclarationOnly": true,
+
+        /* Module Resolution Options */
+        "moduleResolution": "node",
+        /* Specify module resolution strategy: 'node' (Node.js) or 'classic'  */
+        "types": ["react", "react-native"],
+        /* Type declaration files to be included in compilation. */
+        "typeRoots": ["@types/*.d.ts"],
+        "allowSyntheticDefaultImports": true,
+        /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
+        "esModuleInterop": true,
+        /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
+        "baseUrl": "./src",
+        "paths": {
+            "@api": ["./api"],
+            "@components": ["./components"],
+            "@config": ["./config"],
+            "@i18n": ["./i18n"],
+            "@models": ["./models"],
+            "@res": ["./res"],
+            "@utils": ["./utils"]
+        }
+    },
+    "include": ["src/**/*.ts","src/**/*.tsx"],
+    "exclude": ["node_modules",".yalc"]
+}