component-shared 1.0.0

package/Components/Views/DashBoard/SummaryPanel/index.js

@@ -0,0 +1,229 @@
+import { inherits as _inherits, createClass as _createClass, asyncToGenerator as _asyncToGenerator, classCallCheck as _classCallCheck, callSuper as _callSuper, defineProperty as _defineProperty, regenerator as _regenerator } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Component } from 'react';
+import { Grow, Box, Grid, Stack, Typography } from '@mui/material';
+import Folder from '@mui/icons-material/Folder';
+import ImageIcon from '@mui/icons-material/Image';
+import YouTubeIcon from '@mui/icons-material/YouTube';
+import FileIcon from '@mui/icons-material/InsertDriveFile';
+import TrendingUpIcon from '@mui/icons-material/TrendingUp';
+import AudiotrackIcon from '@mui/icons-material/Audiotrack';
+import TrendingDownIcon from '@mui/icons-material/TrendingDown';
+import SmartDisplayIcon from '@mui/icons-material/SmartDisplay';
+import { Bookmark, AutoAwesomeMotion } from '@mui/icons-material';
+import { SkeletonLazyWrap } from '../../../SkeletonLazyView/index.js';
+
+var dataItems = {
+  Folder: {
+    Icon: Folder,
+    Suffixes: 'folder(s)'
+  },
+  File: {
+    Icon: FileIcon,
+    Suffixes: 'file(s)'
+  },
+  Image: {
+    Icon: ImageIcon,
+    Suffixes: 'image(s)'
+  },
+  Video: {
+    Icon: SmartDisplayIcon,
+    Suffixes: 'video(s)'
+  },
+  Audio: {
+    Icon: AudiotrackIcon,
+    Suffixes: 'audio(s)'
+  },
+  Asset: {
+    Icon: AutoAwesomeMotion,
+    Suffixes: 'asset(s)'
+  },
+  AssetLabel: {
+    Icon: Bookmark,
+    Suffixes: 'label(s)'
+  },
+  ChannelContent: {
+    Icon: YouTubeIcon,
+    Suffixes: 'channel(s)'
+  }
+};
+var SummaryPanel = /*#__PURE__*/function (_Component) {
+  /**
+   *
+   */
+  function SummaryPanel(props) {
+    var _this;
+    _classCallCheck(this, SummaryPanel);
+    _this = _callSuper(this, SummaryPanel, [props]);
+    _defineProperty(_this, "_isMounted", true);
+    _defineProperty(_this, "GenerateItems", function () {
+      return Object.keys(dataItems).map(function (key, i) {
+        if (_this.state.ItemSummary) {
+          dataItems[key].Amount = _this.state.ItemSummary[key];
+        }
+        return jsx(ItemInfoV2, {
+          IsLoading: !_this.state.ItemSummary,
+          data: dataItems[key]
+        }, "key".concat(i));
+      });
+    });
+    _this.state = {
+      ItemSummary: null
+    };
+    return _this;
+  }
+  _inherits(SummaryPanel, _Component);
+  return _createClass(SummaryPanel, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this._isMounted = false;
+    }
+  }, {
+    key: "componentDidMount",
+    value: function () {
+      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+        var data;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _context.n = 1;
+              return this.props.GetSummary();
+            case 1:
+              data = _context.v;
+              if (this._isMounted) {
+                _context.n = 2;
+                break;
+              }
+              return _context.a(2);
+            case 2:
+              this.setState({
+                ItemSummary: data
+              });
+            case 3:
+              return _context.a(2);
+          }
+        }, _callee, this);
+      }));
+      function componentDidMount() {
+        return _componentDidMount.apply(this, arguments);
+      }
+      return componentDidMount;
+    }()
+  }, {
+    key: "render",
+    value: function render() {
+      return jsx(Grow, {
+        "in": true,
+        timeout: {
+          enter: 800
+        },
+        style: {
+          transitionDelay: '100ms'
+        },
+        children: jsx(Box, {
+          sx: {
+            display: 'flex',
+            padding: '24px 30px',
+            border: '1px solid rgba(0,0,0,0.12)',
+            borderRadius: '4px'
+          },
+          children: jsx(Grid, {
+            container: true,
+            spacing: 3,
+            children: this.GenerateItems()
+          })
+        })
+      });
+    }
+  }]);
+}(Component); // const ItemInfo: FC<IItemInfoProps> = (props) => {
+var ItemInfoV2 = /*#__PURE__*/function (_Component2) {
+  function ItemInfoV2() {
+    _classCallCheck(this, ItemInfoV2);
+    return _callSuper(this, ItemInfoV2, arguments);
+  }
+  _inherits(ItemInfoV2, _Component2);
+  return _createClass(ItemInfoV2, [{
+    key: "rateData",
+    get: function get() {
+      var rate = this.props.data.Rate;
+      if (!rate) return {
+        icon: TrendingUpIcon,
+        color: '#00a152'
+      };
+      if (rate < 0) return {
+        icon: TrendingDownIcon,
+        color: '#ff1744'
+      };else return {
+        icon: TrendingUpIcon,
+        color: '#00a152'
+      };
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _data$Amount;
+      var _this$props = this.props,
+        data = _this$props.data,
+        IsLoading = _this$props.IsLoading;
+      var RateIcon = this.rateData.icon;
+      return jsx(Grid, {
+        item: true,
+        xs: 6,
+        sm: 4,
+        md: 3,
+        children: jsxs(SkeletonLazyWrap, {
+          IsLoading: IsLoading,
+          component: Stack,
+          sx: {
+            gap: '12px',
+            width: '100%'
+          },
+          children: [jsxs(Box, {
+            sx: {
+              display: 'flex',
+              alignItems: 'center',
+              gap: '8px',
+              color: '#6f6f6f'
+            },
+            children: [jsx(data.Icon, {
+              fontSize: "small"
+            }), jsx(Typography, {
+              variant: "body2",
+              children: data.Suffixes
+            })]
+          }), jsxs(Box, {
+            sx: {
+              display: 'flex',
+              alignItems: 'flex-end',
+              gap: '12px'
+            },
+            children: [jsx(Typography, {
+              variant: "h4",
+              color: "#3c3c3c",
+              children: (_data$Amount = data.Amount) !== null && _data$Amount !== void 0 ? _data$Amount : 0
+            }), data.Rate && data.Rate !== 0 && jsxs(Box, {
+              sx: {
+                display: 'flex',
+                alignItems: 'center',
+                color: this.rateData.color,
+                gap: '6px',
+                marginBottom: '6px'
+              },
+              children: [jsx(RateIcon, {
+                fontSize: "small"
+              }), jsxs(Typography, {
+                variant: "caption",
+                fontWeight: 700,
+                children: [Math.abs(data.Rate).toFixed(2), "%"]
+              })]
+            })]
+          })]
+        })
+      });
+    }
+  }]);
+}(Component);
+
+export { SummaryPanel as default };
+//# sourceMappingURL=index.js.map

package/Components/Views/DashBoard/SummaryPanel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/Components/Views/DashBoard/SummaryPanel/index.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Box, Stack, SvgIcon, Typography, Grid, Grow } from '@mui/material'\r\nimport Folder from '@mui/icons-material/Folder'\r\nimport ImageIcon from '@mui/icons-material/Image'\r\nimport YouTubeIcon from '@mui/icons-material/YouTube'\r\nimport FileIcon from '@mui/icons-material/InsertDriveFile'\r\nimport TrendingUpIcon from '@mui/icons-material/TrendingUp'\r\nimport AudiotrackIcon from '@mui/icons-material/Audiotrack'\r\nimport TrendingDownIcon from '@mui/icons-material/TrendingDown'\r\nimport SmartDisplayIcon from '@mui/icons-material/SmartDisplay'\r\nimport { AutoAwesomeMotion, Bookmark } from '@mui/icons-material'\r\nimport { IItemSummary } from '../../../Models'\r\nimport { SkeletonLazyWrap } from '../../../SkeletonLazyView'\r\n\r\ninterface IDashItem {\r\n  Suffixes: string\r\n  Icon: typeof SvgIcon\r\n  Amount?: number\r\n  Rate?: number\r\n}\r\n\r\ntype TDataItem = { [key in keyof IItemSummary]: IDashItem }\r\n\r\nconst dataItems: TDataItem = {\r\n  Folder: { Icon: Folder, Suffixes: 'folder(s)' },\r\n  File: { Icon: FileIcon, Suffixes: 'file(s)' },\r\n  Image: { Icon: ImageIcon, Suffixes: 'image(s)' },\r\n  Video: { Icon: SmartDisplayIcon, Suffixes: 'video(s)' },\r\n  Audio: { Icon: AudiotrackIcon, Suffixes: 'audio(s)' },\r\n  Asset: { Icon: AutoAwesomeMotion, Suffixes: 'asset(s)' },\r\n  AssetLabel: { Icon: Bookmark, Suffixes: 'label(s)' },\r\n  ChannelContent: { Icon: YouTubeIcon, Suffixes: 'channel(s)' },\r\n}\r\ninterface SummaryPanelProps {\r\n  GetSummary: (signal?: AbortSignal | undefined) => Promise<IItemSummary | null>\r\n}\r\ninterface SummaryPanelState {\r\n  ItemSummary: IItemSummary | null\r\n}\r\nexport default class SummaryPanel extends Component<SummaryPanelProps, SummaryPanelState> {\r\n  /**\r\n   *\r\n   */\r\n  constructor(props: SummaryPanelProps) {\r\n    super(props)\r\n    this.state = {\r\n      ItemSummary: null,\r\n    }\r\n  }\r\n  _isMounted = true\r\n  GenerateItems = () => {\r\n    return Object.keys(dataItems).map((key, i) => {\r\n      if (this.state.ItemSummary) {\r\n        dataItems[key as keyof IItemSummary].Amount = this.state.ItemSummary[key as keyof IItemSummary]\r\n      }\r\n      return <ItemInfoV2 IsLoading={!this.state.ItemSummary} key={`key${i}`} data={dataItems[key as keyof IItemSummary]} />\r\n    })\r\n  }\r\n  componentWillUnmount(): void {\r\n    this._isMounted = false\r\n  }\r\n  async componentDidMount() {\r\n    const data = await this.props.GetSummary()\r\n    if (!this._isMounted) return\r\n    this.setState({ ItemSummary: data })\r\n  }\r\n  render() {\r\n    return (\r\n      <Grow in timeout={{ enter: 800 }} style={{ transitionDelay: '100ms' }}>\r\n        <Box sx={{ display: 'flex', padding: '24px 30px', border: '1px solid rgba(0,0,0,0.12)', borderRadius: '4px' }}>\r\n          <Grid container spacing={3}>\r\n            {this.GenerateItems()}\r\n          </Grid>\r\n        </Box>\r\n      </Grow>\r\n    )\r\n  }\r\n}\r\ninterface IItemInfoProps {\r\n  data: IDashItem\r\n  IsLoading: boolean\r\n}\r\n// const ItemInfo: FC<IItemInfoProps> = (props) => {\r\n//   const { Icon } = props.data\r\n//   return (\r\n//     <SkeletonLazyWrap\r\n//       IsLoading={props.IsLoading}\r\n//       component={Box}\r\n//       sx={{\r\n//         flexDirection: 'column',\r\n//         display: 'flex',\r\n//         padding: 5,\r\n//         margin: '2px',\r\n//         justifyContent: 'space-around',\r\n//         alignItems: 'center',\r\n//         // border: \"1px solid #e0e0e0\",\r\n//         minWidth: '150px',\r\n//       }}\r\n//     >\r\n//       <Icon fontSize=\"large\" color=\"primary\" />\r\n//       <Typography variant=\"h6\">{props.data.Amount ?? 0}</Typography>\r\n//       <Typography>{props.data.Suffixes}</Typography>\r\n//     </SkeletonLazyWrap>\r\n//   )\r\n// }\r\n\r\nclass ItemInfoV2 extends Component<IItemInfoProps> {\r\n  get rateData(): { icon: typeof SvgIcon; color: string } {\r\n    const rate = this.props.data.Rate\r\n    if (!rate) return { icon: TrendingUpIcon, color: '#00a152' }\r\n    if (rate < 0) return { icon: TrendingDownIcon, color: '#ff1744' }\r\n    else return { icon: TrendingUpIcon, color: '#00a152' }\r\n  }\r\n  render() {\r\n    const { data, IsLoading } = this.props\r\n    const RateIcon = this.rateData.icon\r\n    return (\r\n      <Grid item xs={6} sm={4} md={3}>\r\n        <SkeletonLazyWrap IsLoading={IsLoading} component={Stack} sx={{ gap: '12px', width: '100%' }}>\r\n          <Box sx={{ display: 'flex', alignItems: 'center', gap: '8px', color: '#6f6f6f' }}>\r\n            <data.Icon fontSize=\"small\" />\r\n            <Typography variant=\"body2\">{data.Suffixes}</Typography>\r\n          </Box>\r\n          <Box sx={{ display: 'flex', alignItems: 'flex-end', gap: '12px' }}>\r\n            <Typography variant=\"h4\" color=\"#3c3c3c\">\r\n              {data.Amount ?? 0}\r\n            </Typography>\r\n            {data.Rate && data.Rate !== 0 && (\r\n              <Box sx={{ display: 'flex', alignItems: 'center', color: this.rateData.color, gap: '6px', marginBottom: '6px' }}>\r\n                <RateIcon fontSize=\"small\" />\r\n                <Typography variant=\"caption\" fontWeight={700}>\r\n                  {Math.abs(data.Rate).toFixed(2)}%\r\n                </Typography>\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </SkeletonLazyWrap>\r\n      </Grid>\r\n    )\r\n  }\r\n}\r\n"],"names":["dataItems","Folder","Icon","Suffixes","File","FileIcon","Image","ImageIcon","Video","SmartDisplayIcon","Audio","AudiotrackIcon","Asset","AutoAwesomeMotion","AssetLabel","Bookmark","ChannelContent","YouTubeIcon","SummaryPanel","_Component","props","_this","_classCallCheck","_callSuper","_defineProperty","Object","keys","map","key","i","state","ItemSummary","Amount","_jsx","ItemInfoV2","IsLoading","data","_inherits","_createClass","value","componentWillUnmount","_isMounted","_componentDidMount","_asyncToGenerator","_regenerator","m","_callee","w","_context","n","GetSummary","v","a","setState","componentDidMount","apply","arguments","render","Grow","timeout","enter","style","transitionDelay","children","Box","sx","display","padding","border","borderRadius","Grid","container","spacing","GenerateItems","Component","_Component2","get","rate","Rate","icon","TrendingUpIcon","color","TrendingDownIcon","_data$Amount","_this$props","RateIcon","rateData","item","xs","sm","md","_jsxs","SkeletonLazyWrap","component","Stack","gap","width","alignItems","fontSize","Typography","variant","marginBottom","fontWeight","Math","abs","toFixed"],"mappings":"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"}

package/Components/Views/DashBoard/TopChannel/index.d.ts

@@ -0,0 +1,13 @@
+import { Component } from 'react';
+import { TopViewData } from '../type';
+export interface ITopChannelProps {
+    data?: TopViewData[];
+    Title: string;
+    Year: number;
+    IsLoading?: boolean;
+    Prefix?: string;
+    Subfix?: string;
+}
+export default class TopChannel extends Component<ITopChannelProps> {
+    render(): JSX.Element;
+}

package/Components/Views/DashBoard/TopChannel/index.js

@@ -0,0 +1,89 @@
+import { inherits as _inherits, createClass as _createClass, classCallCheck as _classCallCheck, callSuper as _callSuper } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Component } from 'react';
+import { Stack, Box, Typography } from '@mui/material';
+import { RowTitle } from '../Common/index.js';
+import { SkeletonLazyWrap } from '../../../SkeletonLazyView/index.js';
+import TopViewTable from '../TopViewTable/index.js';
+import AnalyticsOutlinedIcon from '@mui/icons-material/AnalyticsOutlined';
+
+var TopChannel = /*#__PURE__*/function (_Component) {
+  function TopChannel() {
+    _classCallCheck(this, TopChannel);
+    return _callSuper(this, TopChannel, arguments);
+  }
+  _inherits(TopChannel, _Component);
+  return _createClass(TopChannel, [{
+    key: "render",
+    value: function render() {
+      var _this$props$data, _this$props$data2;
+      return jsxs(Stack, {
+        sx: {
+          flex: 1,
+          border: '1px solid rgba(0,0,0,0.12)',
+          borderRadius: '4px',
+          padding: '12px',
+          gap: '6px'
+        },
+        children: [jsxs(Box, {
+          sx: {
+            display: 'flex',
+            alignItems: 'center',
+            gap: '6px'
+          },
+          children: [jsx(AnalyticsOutlinedIcon, {
+            color: "primary"
+          }), jsx(Typography, {
+            variant: "subtitle1",
+            color: "primary",
+            sx: {
+              fontWeight: 700,
+              flex: 1
+            },
+            children: this.props.Title
+          })]
+        }), jsxs(Typography, {
+          variant: "body2",
+          sx: {
+            color: '#979797'
+          },
+          children: ["Year ", this.props.Year]
+        }), jsx(Box, {
+          mx: "-16px",
+          children: jsx(SkeletonLazyWrap, {
+            IsLoading: this.props.IsLoading !== false,
+            component: Box,
+            sx: {
+              minHeight: '300px'
+            },
+            children: this.props.IsLoading === false && !((_this$props$data = this.props.data) !== null && _this$props$data !== void 0 && _this$props$data.length) ? jsx(Box, {
+              sx: {
+                display: 'flex',
+                flex: 1,
+                justifyContent: 'center',
+                alignItems: 'center',
+                height: '100%'
+              },
+              children: "None"
+            }) : jsx(TopViewTable, {
+              data: (_this$props$data2 = this.props.data) !== null && _this$props$data2 !== void 0 ? _this$props$data2 : [],
+              Prefix: this.props.Prefix,
+              Subfix: this.props.Subfix,
+              renderName: function renderName(data) {
+                return jsx(RowTitle, {
+                  Thumb: data.Thumb,
+                  type: 'Channel',
+                  Id: data.Id,
+                  children: data.Name
+                });
+              }
+            })
+          })
+        })]
+      });
+    }
+  }]);
+}(Component);
+
+export { TopChannel as default };
+//# sourceMappingURL=index.js.map

package/Components/Views/DashBoard/TopChannel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/Components/Views/DashBoard/TopChannel/index.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Stack, Typography, Box } from '@mui/material'\r\nimport { RowTitle } from '../Common'\r\nimport { TopViewData } from '../type'\r\nimport { SkeletonLazyWrap } from '../../../SkeletonLazyView'\r\nimport TopViewTable from '../TopViewTable'\r\nimport AnalyticsOutlinedIcon from '@mui/icons-material/AnalyticsOutlined'\r\n\r\nexport interface ITopChannelProps {\r\n  data?: TopViewData[]\r\n  Title: string\r\n  Year: number\r\n  IsLoading?: boolean\r\n  Prefix?: string\r\n  Subfix?: string\r\n}\r\n\r\nexport default class TopChannel extends Component<ITopChannelProps> {\r\n  render() {\r\n    return (\r\n      <Stack sx={{ flex: 1, border: '1px solid rgba(0,0,0,0.12)', borderRadius: '4px', padding: '12px', gap: '6px' }}>\r\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: '6px' }}>\r\n          <AnalyticsOutlinedIcon color=\"primary\" />\r\n          <Typography variant=\"subtitle1\" color=\"primary\" sx={{ fontWeight: 700, flex: 1 }}>\r\n            {this.props.Title}\r\n          </Typography>\r\n        </Box>\r\n        <Typography variant=\"body2\" sx={{ color: '#979797' }}>\r\n          Year {this.props.Year}\r\n        </Typography>\r\n        <Box mx=\"-16px\">\r\n          <SkeletonLazyWrap IsLoading={this.props.IsLoading !== false} component={Box} sx={{ minHeight: '300px' }}>\r\n            {this.props.IsLoading === false && !this.props.data?.length ? (\r\n              <Box sx={{ display: 'flex', flex: 1, justifyContent: 'center', alignItems: 'center', height: '100%' }}>None</Box>\r\n            ) : (\r\n              <TopViewTable\r\n                data={this.props.data ?? []}\r\n                Prefix={this.props.Prefix}\r\n                Subfix={this.props.Subfix}\r\n                renderName={(data) => (\r\n                  <RowTitle Thumb={data.Thumb} type={'Channel'} Id={data.Id}>\r\n                    {data.Name}\r\n                  </RowTitle>\r\n                )}\r\n              />\r\n            )}\r\n          </SkeletonLazyWrap>\r\n        </Box>\r\n      </Stack>\r\n    )\r\n  }\r\n}\r\n"],"names":["TopChannel","_Component","_classCallCheck","_callSuper","arguments","_inherits","_createClass","key","value","render","_this$props$data","_this$props$data2","_jsxs","Stack","sx","flex","border","borderRadius","padding","gap","children","Box","display","alignItems","_jsx","AnalyticsOutlinedIcon","color","Typography","variant","fontWeight","props","Title","Year","mx","SkeletonLazyWrap","IsLoading","component","minHeight","data","length","justifyContent","height","TopViewTable","Prefix","Subfix","renderName","RowTitle","Thumb","type","Id","Name","Component"],"mappings":"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"}

package/Components/Views/DashBoard/TopViewTable/index.d.ts

@@ -0,0 +1,12 @@
+import { Component } from 'react';
+import { TopViewData } from '../type';
+interface ITopViewTableProps {
+    renderName?: (data: TopViewData) => JSX.Element;
+    data: TopViewData[];
+    Prefix?: string;
+    Subfix?: string;
+}
+export default class TopViewTable extends Component<ITopViewTableProps> {
+    render(): JSX.Element;
+}
+export {};

package/Components/Views/DashBoard/TopViewTable/index.js

@@ -0,0 +1,79 @@
+import { defineProperty as _defineProperty, inherits as _inherits, createClass as _createClass, toConsumableArray as _toConsumableArray, classCallCheck as _classCallCheck, callSuper as _callSuper } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Component } from 'react';
+import Table from '@mui/material/Table';
+import TableBody from '@mui/material/TableBody';
+import TableCell from '@mui/material/TableCell';
+import TableRow from '@mui/material/TableRow';
+import { styled } from '@mui/material/styles';
+import LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress';
+import { humannumber } from '../../../Helper/index.js';
+
+var BorderLinearProgress = styled(LinearProgress)(function (_ref) {
+  var theme = _ref.theme;
+  return _defineProperty(_defineProperty({
+    height: 8,
+    borderRadius: 5
+  }, "&.".concat(linearProgressClasses.colorPrimary), {
+    backgroundColor: theme.palette.grey[theme.palette.mode === 'light' ? 200 : 800]
+  }), "& .".concat(linearProgressClasses.bar), {
+    borderRadius: 5,
+    backgroundColor: theme.palette.mode === 'light' ? '#1a90ff' : '#308fe8'
+  });
+});
+var TopViewTable = /*#__PURE__*/function (_Component) {
+  function TopViewTable() {
+    _classCallCheck(this, TopViewTable);
+    return _callSuper(this, TopViewTable, arguments);
+  }
+  _inherits(TopViewTable, _Component);
+  return _createClass(TopViewTable, [{
+    key: "render",
+    value: function render() {
+      var _this = this;
+      var maxView = Math.max.apply(Math, _toConsumableArray(this.props.data.map(function (x) {
+        return x.Value;
+      })));
+      return jsx(Table, {
+        "aria-label": "simple table",
+        children: jsx(TableBody, {
+          children: this.props.data.map(function (row, index) {
+            var progressValue = row.Value * 100 / maxView;
+            progressValue = progressValue > 2 ? progressValue : 2;
+            return jsxs(TableRow, {
+              sx: {
+                '&:last-child td, &:last-child th': {
+                  border: 0
+                }
+              },
+              children: [jsx(TableCell, {
+                sx: {
+                  flex: 9
+                },
+                children: _this.props.renderName ? _this.props.renderName(row) : row.Name
+              }), jsx(TableCell, {
+                sx: {
+                  width: "150px"
+                },
+                align: "right",
+                children: jsx(BorderLinearProgress, {
+                  variant: "determinate",
+                  value: progressValue
+                })
+              }), jsxs(TableCell, {
+                sx: {
+                  flex: 1
+                },
+                align: "right",
+                children: [_this.props.Prefix, humannumber(row.Value), _this.props.Subfix]
+              })]
+            }, row.Id);
+          })
+        })
+      });
+    }
+  }]);
+}(Component);
+
+export { TopViewTable as default };
+//# sourceMappingURL=index.js.map

package/Components/Views/DashBoard/TopViewTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/Components/Views/DashBoard/TopViewTable/index.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport Table from '@mui/material/Table';\r\nimport TableBody from '@mui/material/TableBody';\r\nimport TableCell from '@mui/material/TableCell';\r\nimport TableContainer from '@mui/material/TableContainer';\r\nimport TableHead from '@mui/material/TableHead';\r\nimport TableRow from '@mui/material/TableRow';\r\nimport Paper from '@mui/material/Paper';\r\nimport Typography from '@mui/material/Typography';\r\nimport { styled } from '@mui/material/styles';\r\nimport LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress';\r\nimport { TopViewData } from '../type';\r\nimport { humannumber } from '../../../Helper';\r\n\r\nconst BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({\r\n    height: 8,\r\n    borderRadius: 5,\r\n    [`&.${linearProgressClasses.colorPrimary}`]: {\r\n        backgroundColor: theme.palette.grey[theme.palette.mode === 'light' ? 200 : 800],\r\n    },\r\n    [`& .${linearProgressClasses.bar}`]: {\r\n        borderRadius: 5,\r\n        backgroundColor: theme.palette.mode === 'light' ? '#1a90ff' : '#308fe8',\r\n    },\r\n}));\r\n\r\ninterface ITopViewTableProps {\r\n    renderName?: (data: TopViewData) => JSX.Element\r\n    data: TopViewData[]\r\n    Prefix?: string\r\n    Subfix?: string\r\n}\r\nexport default class TopViewTable extends Component<ITopViewTableProps> {\r\n    render() {\r\n        const maxView = Math.max(...this.props.data.map(x => x.Value))\r\n        return (\r\n            <Table aria-label=\"simple table\">\r\n                <TableBody>\r\n                    {this.props.data.map((row, index) => {\r\n                        let progressValue = row.Value * 100 / maxView\r\n                        progressValue = progressValue > 2 ? progressValue : 2\r\n                        return <TableRow\r\n                            key={row.Id}\r\n                            sx={{ '&:last-child td, &:last-child th': { border: 0 } }}\r\n                        >\r\n                            <TableCell sx={{ flex: 9 }} >\r\n                                {this.props.renderName ? this.props.renderName(row) : row.Name}\r\n                            </TableCell>\r\n                            <TableCell sx={{ width: \"150px\" }} align=\"right\">\r\n                                <BorderLinearProgress variant=\"determinate\" value={progressValue} />\r\n                            </TableCell>\r\n                            <TableCell sx={{ flex: 1 }} align=\"right\">{this.props.Prefix}{humannumber(row.Value)}{this.props.Subfix}</TableCell>\r\n                        </TableRow>\r\n\r\n                    })}\r\n                </TableBody>\r\n            </Table>\r\n        )\r\n    }\r\n}\r\n"],"names":["BorderLinearProgress","styled","LinearProgress","_ref","theme","_defineProperty","height","borderRadius","concat","linearProgressClasses","colorPrimary","backgroundColor","palette","grey","mode","bar","TopViewTable","_Component","_classCallCheck","_callSuper","arguments","_inherits","_createClass","key","value","render","_this","maxView","Math","max","apply","_toConsumableArray","props","data","map","x","Value","_jsx","Table","children","TableBody","row","index","progressValue","_jsxs","TableRow","sx","border","TableCell","flex","renderName","Name","width","align","variant","Prefix","humannumber","Subfix","Id","Component"],"mappings":"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"}

package/Components/Views/DashBoard/type.d.ts

@@ -0,0 +1,9 @@
+export interface TopViewData {
+    Id: string;
+    Name: string;
+    Value: number;
+    Thumb?: string;
+}
+export interface TopChannelState {
+    data: TopViewData[];
+}

package/Components/Views/DashBoard/type.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=type.js.map

package/Components/Views/DashBoard/type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"type.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/Components/Views/Helper/index.d.ts

@@ -0,0 +1,2 @@
+import { IChannelResourceInfo } from "../../Models";
+export declare const ExtractChannelResourceInfo: (data: string) => IChannelResourceInfo | null;

package/Components/Views/Helper/index.js

@@ -0,0 +1,10 @@
+var ExtractChannelResourceInfo = function ExtractChannelResourceInfo(data) {
+  try {
+    return JSON.parse(data);
+  } catch (_unused) {
+    return null;
+  }
+};
+
+export { ExtractChannelResourceInfo };
+//# sourceMappingURL=index.js.map

package/Components/Views/Helper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/Components/Views/Helper/index.ts"],"sourcesContent":["import { IChannelResourceInfo } from \"../../Models\"\r\n\r\nexport const ExtractChannelResourceInfo = (data: string) => {\r\n    try {\r\n        return JSON.parse(data) as IChannelResourceInfo\r\n    } catch {\r\n        return null\r\n    }\r\n}"],"names":["ExtractChannelResourceInfo","data","JSON","parse","_unused"],"mappings":"IAEaA,0BAA0B,GAAG,SAA7BA,0BAA0BA,CAAIC,IAAY,EAAI;EACvD,IAAI;AACA,IAAA,OAAOC,IAAI,CAACC,KAAK,CAACF,IAAI,CAAyB;GAClD,CAAC,OAAAG,OAAA,EAAM;AACJ,IAAA,OAAO,IAAI;AACd;AACL;;;;"}

package/Components/YoutubeImage/index.d.ts

@@ -0,0 +1,45 @@
+import React, { Component } from 'react';
+interface IYoutubeImageProps {
+    imgProps?: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
+    ContentId: string;
+}
+interface IYoutubeImageState {
+    image: string;
+}
+export default class YoutubeImage extends Component<IYoutubeImageProps, IYoutubeImageState> {
+    constructor(props: IYoutubeImageProps);
+    ApiKey: string | undefined;
+    componentDidMount: () => void;
+    render(): JSX.Element;
+}
+export interface ResponseImage {
+    items: Item[];
+}
+export interface Item {
+    id: string;
+    snippet: Snippet;
+}
+export interface Snippet {
+    thumbnails: Thumbnails;
+}
+export interface Thumbnails {
+    default: Default;
+    medium: Medium;
+    high: High;
+}
+export interface Default {
+    url: string;
+    width: number;
+    height: number;
+}
+export interface Medium {
+    url: string;
+    width: number;
+    height: number;
+}
+export interface High {
+    url: string;
+    width: number;
+    height: number;
+}
+export {};

package/Components/YoutubeImage/index.js

@@ -0,0 +1,52 @@
+import { inherits as _inherits, createClass as _createClass, objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, classCallCheck as _classCallCheck, callSuper as _callSuper, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx } from 'react/jsx-runtime';
+import { Component } from 'react';
+
+var _excluded = ["src"];
+var YoutubeImage = /*#__PURE__*/function (_Component) {
+  function YoutubeImage(props) {
+    var _this;
+    _classCallCheck(this, YoutubeImage);
+    _this = _callSuper(this, YoutubeImage, [props]);
+    _defineProperty(_this, "ApiKey", '');
+    _defineProperty(_this, "componentDidMount", function () {
+      if (_this.props.ContentId.length == 24) {
+        fetch("https://www.googleapis.com/youtube/v3/channels?part=snippet&id=".concat(_this.props.ContentId, "&fields=items(id%2Csnippet%2Fthumbnails)&key=").concat(_this.ApiKey)).then(function (x) {
+          return x.json();
+        }).then(function (x) {
+          var data = x;
+          _this.setState({
+            image: data.items[0].snippet.thumbnails["default"].url
+          });
+        })["catch"](function () {
+          return console.log("error!");
+        });
+      } else {
+        _this.setState({
+          image: "https://i.ytimg.com/vi/".concat(_this.props.ContentId, "/mqdefault.jpg")
+        });
+      }
+    });
+    _this.ApiKey = process.env.REACT_APP_YOUTUBE_IMAGE_KEY;
+    _this.state = {
+      image: 'https://i.ytimg.com/vi/111111111111/mqdefault.jpg'
+    };
+    return _this;
+  }
+  _inherits(YoutubeImage, _Component);
+  return _createClass(YoutubeImage, [{
+    key: "render",
+    value: function render() {
+      var _this$props$imgProps;
+      var _ref = (_this$props$imgProps = this.props.imgProps) !== null && _this$props$imgProps !== void 0 ? _this$props$imgProps : {};
+        _ref.src;
+        var other = _objectWithoutProperties(_ref, _excluded);
+      return jsx("img", _objectSpread2({
+        src: this.state.image
+      }, other));
+    }
+  }]);
+}(Component);
+
+export { YoutubeImage as default };
+//# sourceMappingURL=index.js.map

package/Components/YoutubeImage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/Components/YoutubeImage/index.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\ninterface IYoutubeImageProps {\r\n    imgProps?: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>\r\n    ContentId: string\r\n}\r\ninterface IYoutubeImageState {\r\n    image: string\r\n}\r\nexport default class YoutubeImage extends Component<IYoutubeImageProps, IYoutubeImageState> {\r\n    constructor(props: IYoutubeImageProps) {\r\n        super(props)\r\n        this.ApiKey = process.env.REACT_APP_YOUTUBE_IMAGE_KEY as string | undefined\r\n        this.state = {\r\n            image: 'https://i.ytimg.com/vi/111111111111/mqdefault.jpg'\r\n        }\r\n    }\r\n    ApiKey: string | undefined = ''\r\n    componentDidMount = () => {\r\n        if (this.props.ContentId.length == 24) {\r\n            fetch(`https://www.googleapis.com/youtube/v3/channels?part=snippet&id=${this.props.ContentId}&fields=items(id%2Csnippet%2Fthumbnails)&key=${this.ApiKey}`)\r\n                .then(x => x.json())\r\n                .then(x => {\r\n                    const data = x as ResponseImage\r\n                    this.setState({ image: data.items[0].snippet.thumbnails.default.url })\r\n                })\r\n                .catch(() => console.log(\"error!\"))\r\n        } else {\r\n            this.setState({ image: `https://i.ytimg.com/vi/${this.props.ContentId}/mqdefault.jpg` })\r\n        }\r\n    }\r\n    render() {\r\n        const { src, ...other } = this.props.imgProps ?? {}\r\n        return (\r\n            <img src={this.state.image} {...other} />\r\n        )\r\n    }\r\n}\r\n\r\n\r\nexport interface ResponseImage {\r\n    items: Item[]\r\n}\r\n\r\nexport interface Item {\r\n    id: string\r\n    snippet: Snippet\r\n}\r\n\r\nexport interface Snippet {\r\n    thumbnails: Thumbnails\r\n}\r\n\r\nexport interface Thumbnails {\r\n    default: Default\r\n    medium: Medium\r\n    high: High\r\n}\r\n\r\nexport interface Default {\r\n    url: string\r\n    width: number\r\n    height: number\r\n}\r\n\r\nexport interface Medium {\r\n    url: string\r\n    width: number\r\n    height: number\r\n}\r\n\r\nexport interface High {\r\n    url: string\r\n    width: number\r\n    height: number\r\n}\r\n"],"names":["YoutubeImage","_Component","props","_this","_classCallCheck","_callSuper","_defineProperty","ContentId","length","fetch","concat","ApiKey","then","x","json","data","setState","image","items","snippet","thumbnails","url","console","log","process","env","REACT_APP_YOUTUBE_IMAGE_KEY","state","_inherits","_createClass","key","value","render","_this$props$imgProps","_ref","imgProps","src","other","_objectWithoutProperties","_excluded","_jsx","_objectSpread","Component"],"mappings":";;;;;AAQqBA,IAAAA,YAAa,0BAAAC,UAAA,EAAA;EAC9B,SAAAD,YAAAA,CAAYE,KAAyB,EAAA;AAAA,IAAA,IAAAC,KAAA;AAAAC,IAAAA,eAAA,OAAAJ,YAAA,CAAA;AACjCG,IAAAA,KAAA,GAAAE,UAAA,CAAAL,IAAAA,EAAAA,YAAA,GAAME,KAAK,CAAA,CAAA;IAACI,eAAA,CAAAH,KAAA,EAAA,QAAA,EAMa,EAAE,CAAA;IAAAG,eAAA,CAAAH,KAAA,EAAA,mBAAA,EACX,YAAK;MACrB,IAAIA,KAAA,CAAKD,KAAK,CAACK,SAAS,CAACC,MAAM,IAAI,EAAE,EAAE;QACnCC,KAAK,CAAA,iEAAA,CAAAC,MAAA,CAAmEP,KAAA,CAAKD,KAAK,CAACK,SAAS,EAAAG,+CAAAA,CAAAA,CAAAA,MAAA,CAAgDP,KAAA,CAAKQ,MAAM,CAAE,CAAC,CACrJC,IAAI,CAAC,UAAAC,CAAC,EAAA;AAAA,UAAA,OAAIA,CAAC,CAACC,IAAI,EAAE;AAAA,SAAA,CAAC,CACnBF,IAAI,CAAC,UAAAC,CAAC,EAAG;UACN,IAAME,IAAI,GAAGF,CAAkB;UAC/BV,KAAA,CAAKa,QAAQ,CAAC;AAAEC,YAAAA,KAAK,EAAEF,IAAI,CAACG,KAAK,CAAC,CAAC,CAAC,CAACC,OAAO,CAACC,UAAU,CAAA,SAAA,CAAQ,CAACC;AAAK,WAAA,CAAC;SACzE,CAAC,SACI,CAAC,YAAA;AAAA,UAAA,OAAMC,OAAO,CAACC,GAAG,CAAC,QAAQ,CAAC;SAAC,CAAA;AAC1C,OAAA,MAAM;QACHpB,KAAA,CAAKa,QAAQ,CAAC;AAAEC,UAAAA,KAAK,4BAAAP,MAAA,CAA4BP,KAAA,CAAKD,KAAK,CAACK,SAAS,EAAA,gBAAA;AAAgB,SAAE,CAAC;AAC3F;KACJ,CAAA;AAlBGJ,IAAAA,KAAA,CAAKQ,MAAM,GAAGa,OAAO,CAACC,GAAG,CAACC,2BAAiD;IAC3EvB,KAAA,CAAKwB,KAAK,GAAG;AACTV,MAAAA,KAAK,EAAE;KACV;AAAA,IAAA,OAAAd,KAAA;AACL;EAACyB,SAAA,CAAA5B,YAAA,EAAAC,UAAA,CAAA;EAAA,OAAA4B,YAAA,CAAA7B,YAAA,EAAA,CAAA;IAAA8B,GAAA,EAAA,QAAA;AAAAC,IAAAA,KAAA,EAeD,SAAAC,MAAMA,GAAA;AAAA,MAAA,IAAAC,oBAAA;AACF,MAAA,IAAAC,IAAA,GAAA,CAAAD,oBAAA,GAA0B,IAAI,CAAC/B,KAAK,CAACiC,QAAQ,cAAAF,oBAAA,KAAA,MAAA,GAAAA,oBAAA,GAAI,EAAE;QAAxCC,IAAA,CAAHE,GAAG;AAAKC,YAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;AACrB,MAAA,OACIC,GAAA,CAAA,KAAA,EAAAC,cAAA,CAAA;AAAKL,QAAAA,GAAG,EAAE,IAAI,CAACT,KAAK,CAACV;OAAWoB,EAAAA,KAAK,CAAA,CAAI;AAEjD;AAAC,GAAA,CAAA,CAAA;AAAA,CAAA,CA3BqCK,SAAiD;;;;"}