pixel-react 1.5.6 → 1.5.7

package/src/components/Charts/LineChart/LineChart.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { LineChartProps } from './types';
 import './LineChart.scss';
+import Typography from '../../Typography';
 
 interface HoverState {
   cursorX: number | null;
@@ -21,6 +22,9 @@ const LineChart: React.FC<LineChartProps> = ({
   xAxisColor,
   yAxisColor,
   yAxisLabelColor,
+  textSize,
+  fontWeight,
+  numberSize,
 }) => {
   const margin = 40;
   const xMax = width - margin * 2;
@@ -29,29 +33,25 @@ const LineChart: React.FC<LineChartProps> = ({
   const isDefaultLineChart =
     data[0]?.data[0]?.hasOwnProperty('date') &&
     data[0]?.data[0]?.hasOwnProperty('totalMemory');
-  const xKey = isDefaultLineChart ? 'date' : 'date'; // 'date' for DefaultLineChart, 'x' for StatusLineChart
-  const yKey = isDefaultLineChart ? 'totalMemory' : 'value'; // 'totalMemory' for DefaultLineChart, 'y' for StatusLineChart
-
-  const allZero = data.every((line) =>
-    line.data.every((d: { [key: string]: any }) => d[yKey] === 0)
-  );
-
-  const yMaxExtended = allZero
-    ? 4
-    : Math.max(
-        ...data.flatMap((line) =>
-          line.data.map((d: { [key: string]: any }) => d[yKey])
-        )
-      ) + 3;
-
+  const xKey = isDefaultLineChart ? 'date' : 'date'; 
+  const yKey = isDefaultLineChart ? 'totalMemory' : 'value'; 
   const xScale = (x: string) => {
-    if (isDefaultLineChart) {
-      return (parseInt(x) - 0.7) * (xMax / data[0].data.length);
-    }
-    return (parseInt(x) - 0.7) * (xMax / data[0].data.length);
+    const date = new Date(x);
+    const time = date.getTime();
+    const minDate = new Date(
+      Math.min(...data[0].data.map((d: any) => new Date(d[xKey]).getTime()))
+    );
+    const maxDate = new Date(
+      Math.max(...data[0].data.map((d: any) => new Date(d[xKey]).getTime()))
+    );
+
+    return (
+      ((time - minDate.getTime()) / (maxDate.getTime() - minDate.getTime())) *
+      xMax
+    );
   };
 
-  const yScale = (y: number) => yMax - (y * yMax) / yMaxExtended;
+  const yScale = (y: number) => yMax - (y * yMax) / 1024;
 
   const generateLinePath = (lineData: { [key: string]: any }[]) =>
     lineData.reduce((path, point, i) => {
@@ -127,11 +127,11 @@ const LineChart: React.FC<LineChartProps> = ({
       currentXValue: null,
     });
 
-  const xTickInterval = Math.floor(data[0].data.length / 6);
+  const xTickInterval = Math.floor(data[0].data.length / 4);
 
   return (
     <div className="ff-line-chart-text">
-      <p className="ff-line-chart-text1">{yAxisLabel}</p>
+      <Typography className="ff-line-chart-text1" fontSize={textSize} fontWeight="semi-bold">{yAxisLabel}</Typography>
       <svg
         width={width}
         height={height}
@@ -155,6 +155,7 @@ const LineChart: React.FC<LineChartProps> = ({
             textAnchor="middle"
             fill={yAxisLabelColor}
             className="ff-line-chart-x-axis-label"
+            style={{fontSize:textSize , fontWeight:fontWeight}}
           >
             {xAxisLabel}
           </text>
@@ -185,7 +186,7 @@ const LineChart: React.FC<LineChartProps> = ({
                       r={5}
                       fill="white"
                       stroke={line.color}
-                      strokeWidth={2}
+                      strokeWidth={lineChartWidth}
                       style={{ transition: 'cx 0.1s, cy 0.1s' }}
                     />
                     <line
@@ -212,23 +213,25 @@ const LineChart: React.FC<LineChartProps> = ({
                 textAnchor="middle"
                 fill={yAxisColor}
                 className="ff--line-chart-x-line-data"
+                style={{ fontSize:numberSize}}
               >
                 {point[xKey] != null ? String(point[xKey]) : ''}
               </text>
             ))}
 
           {Array.from({ length: 6 }).map((_, i) => {
-            const yValue = (i * yMaxExtended) / 5;
+            const yValueInGB = i * 0.2; 
             return (
               <text
-                key={yValue}
+                key={yValueInGB}
                 x={-15}
-                y={yScale(yValue)}
+                y={yScale(yValueInGB * 1024)} 
                 textAnchor="middle"
                 fill={yAxisValueColor}
                 className="ff-line-chart-y-axis-text"
+                style={{ fontSize:numberSize}}
               >
-                {yValue.toFixed(1)}
+                {yValueInGB.toFixed(1)}
               </text>
             );
           })}

package/src/components/Charts/LineChart/types.ts

@@ -1,27 +1,29 @@
 export interface LineChartDataPoint {
-    point: any;
-    x: string;
-    y: number;
+  point: any;
+  x: string;
+  y: number;
 }
 
 export interface Line {
-    show: boolean;
-    color: string; 
-    data: LineChartDataPoint[]; 
+  show: boolean;
+  color: string;
+  data: LineChartDataPoint[];
 }
 
 export interface LineChartProps {
-    data: any[]; 
-    width: number; 
-    height: number; 
-    axisColor: string; 
-    isStatusVariant?: boolean;
-    lineChartWidth?:number;
-    yAxisLabel?:string;
-    xAxisLabel?:string;
-    yAxisValueColor?:string;
-    xAxisColor?:string;
-    yAxisColor?:string;
-    yAxisLabelColor?:string;
-   
-}
+  data: any[];
+  width: number;
+  height: number;
+  axisColor: string;
+  isStatusVariant?: boolean;
+  lineChartWidth?: number;
+  yAxisLabel?: string;
+  xAxisLabel?: string;
+  yAxisValueColor?: string;
+  xAxisColor?: string;
+  yAxisColor?: string;
+  yAxisLabelColor?: string;
+  textSize?: string | number;
+  fontWeight?: string | number;
+  numberSize?: string | number;
+}

package/src/components/Icon/iconList.ts

@@ -220,6 +220,7 @@ import AddUser from '../../assets/icons/add_user.svg?react';
 import RemoveUser from '../../assets/icons/remove_user.svg?react';
 import AddToArchive from '../../assets/icons/add_archive.svg?react';
 import DashboardIcon from '../../assets/icons/dashboard_icon.svg?react'; //TODO:this is temporary icon
+import InfoUser from '../../assets/icons/info_user.svg?react';
 
 Components['success'] = ToastSuccessIcon;
 Components['alert'] = Alert;
@@ -436,5 +437,6 @@ Components['add_user'] = AddUser;
 Components['add_to_archive'] = AddToArchive;
 Components['remove_user'] = RemoveUser;
 Components['dashboard_icon'] = DashboardIcon;//TODO:this is temporary icon
+Components['info_user'] = InfoUser;
 
 export default Components;

package/lib/components/AddButton/AddButton.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import './AddButton.scss';
-import { AddButtonProps } from './types';
-declare const AddButton: React.FC<AddButtonProps>;
-export default AddButton;

package/lib/components/AddButton/AddButton.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import AddButton from './AddButton';
-declare const meta: Meta<typeof AddButton>;
-type Story = StoryObj<typeof AddButton>;
-export declare const PrimaryAddButton: Story;
-export default meta;

package/lib/components/AddButton/index.d.ts

@@ -1 +0,0 @@
-export { default } from './AddButton';

package/lib/components/AddButton/types.d.ts

@@ -1,4 +0,0 @@
-export interface AddButtonProps {
-    name: string;
-    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
-}

package/lib/components/AttachImage/AttachImage.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import AttachImage from './AttachImage';
-import { AttachImageProps } from './types';
-declare const meta: Meta<typeof AttachImage>;
-export default meta;
-type Story = StoryObj<AttachImageProps>;
-export declare const Default: Story;

package/lib/components/Charts/BarChart/BarChart.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import BarChart from './BarChart';
-declare const meta: Meta<typeof BarChart>;
-export default meta;
-type Story = StoryObj<typeof BarChart>;
-export declare const BarChartDashboard: Story;

package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import IconRadialChart from './IconRadialChart';
-declare const meta: Meta<typeof IconRadialChart>;
-export default meta;
-type Story = StoryObj<typeof IconRadialChart>;
-export declare const Default: Story;
-export declare const Mobile: Story;
-export declare const WithoutIcon: Story;

package/lib/components/Charts/LineChart/LineChart.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import LineChart from './LineChart';
-import { LineChartProps } from './types';
-declare const meta: Meta<typeof LineChart>;
-export default meta;
-export declare const DefaultLineChart: StoryObj<LineChartProps>;
-export declare const StatusLineChart: StoryObj<LineChartProps>;

package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import MultiRadialChart from './MultiRadialChart';
-declare const meta: Meta<typeof MultiRadialChart>;
-export default meta;
-type Story = StoryObj<typeof MultiRadialChart>;
-export declare const Default: Story;
-export declare const numberLegend: Story;
-export declare const PillLegend: Story;

package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import ConnectingBranch from './ConnectingBranch';
-declare const meta: Meta<typeof ConnectingBranch>;
-export default meta;
-type Story = StoryObj<typeof ConnectingBranch>;
-export declare const Default: Story;

package/lib/components/EditTextField/EditTextField.stories.d.ts

@@ -1,10 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import EditTextField from './EditTextField';
-import '../../assets/styles/_colors.scss';
-import './EditTextField.scss';
-declare const meta: Meta<typeof EditTextField>;
-type Story = StoryObj<typeof EditTextField>;
-export declare const textFieldWithLabel: Story;
-export declare const textFieldWithOutLabel: Story;
-export declare const openTextField: Story;
-export default meta;

package/lib/components/Editor/Editor.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { EditorProps } from './types';
-declare const meta: Meta<EditorProps>;
-export default meta;
-type Story = StoryObj<EditorProps>;
-export declare const Default: Story;

package/lib/components/Excel/ContextMenu/ContextMenu.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import './ContextMenu.scss';
-declare const ContextMenu: React.FC<ContextMenuProps>;
-export default ContextMenu;

package/lib/components/Excel/ExcelFile.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import ExcelFile from './ExcelFile/ExcelFile';
-declare const meta: Meta<typeof ExcelFile>;
-type Story = StoryObj<typeof ExcelFile>;
-export declare const Default: Story;
-export default meta;

package/lib/components/ExcelFile/ChangeExcelStyles.d.ts

@@ -1,14 +0,0 @@
-import { CellBase } from "./ExcelFile/Excel";
-interface ChangeExcelStylesOptions {
-    sheetName: string;
-    styleType: string;
-    value: string;
-    selectedCell: {
-        row: number;
-        column: number;
-    }[];
-}
-export default function ChangeExcelStyles(setWorksheetsData: React.Dispatch<React.SetStateAction<{
-    [key: string]: Matrix<CellBase>;
-}>>, options: ChangeExcelStylesOptions): void;
-export {};

package/lib/components/ExcelFile/ImportExcelStyles.d.ts

@@ -1,24 +0,0 @@
-interface CellStyle {
-    color?: string;
-    backgroundColor?: string;
-    bold?: boolean;
-    italic?: boolean;
-    name?: string;
-    border: {
-        top: string;
-        bottom: string;
-        left: string;
-        right: string;
-    };
-    alignment: {
-        horizontal?: string;
-        vertical?: string;
-        wrapText?: boolean;
-    };
-}
-interface CellData {
-    style?: CellStyle;
-}
-type ImportExcelStylesData = Array<Array<CellData>>;
-export default function ImportExcelStyles(data: ImportExcelStylesData | null): void;
-export {};

package/lib/components/StatusCard/StatusCard.stories.d.ts

@@ -1,11 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import Card from './StatusCard';
-import { CardProps } from './types';
-declare const meta: Meta<typeof Card>;
-export default meta;
-type Story = StoryObj<CardProps>;
-export declare const Passed: Story;
-export declare const Failed: Story;
-export declare const Warning: Story;
-export declare const Skipped: Story;
-export declare const Flaky: Story;

package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import type { Meta, StoryObj } from '@storybook/react';
-import { MachineExecutionInstanceDataSet } from './types';
-declare const SequentialPayloadComponent: React.FC<{
-    machineInstances: MachineExecutionInstanceDataSet[];
-}>;
-declare const meta: Meta<typeof SequentialPayloadComponent>;
-type Story = StoryObj<typeof SequentialPayloadComponent>;
-export declare const Primary: Story;
-export default meta;