Shayan/74993/circular progress component ts migration

packages/components/src/components/circular-progress/circular-progress.jsx → packages/components/src/components/circular-progress/circular-progress.tsx

@@ -1,9 +1,28 @@
 import classNames from 'classnames';
-import PropTypes from 'prop-types';
 import React from 'react';
 import Icon from '../icon/icon';
 
-const CircularProgress = ({ className, danger_limit, icon, is_clockwise, progress, radius, stroke, warning_limit }) => {
+type TCircularProgressProps = {
+    className?: string;
+    danger_limit?: number;
+    is_clockwise?: boolean;
+    progress?: number;
+    radius?: number;
+    stroke?: number;
+    warning_limit?: number;
+    icon?: string;
+};
+
+const CircularProgress = ({
+    className,
+    danger_limit = 20,
+    icon = '',
+    is_clockwise = false,
+    progress = 0,
+    radius = 22,
+    stroke = 3,
+    warning_limit = 50,
+}: TCircularProgressProps) => {
     const normalizedRadius = radius - stroke / 2;
     const circumference = normalizedRadius * 2 * Math.PI;
     const strokeDashoffset = circumference - (progress / 100) * circumference;
@@ -30,25 +49,4 @@ const CircularProgress = ({ className, danger_limit, icon, is_clockwise, progres
     );
 };
 
-CircularProgress.defaultProps = {
-    icon: 'IcClockOutline',
-    danger_limit: 20,
-    is_clockwise: false,
-    progress: 0,
-    radius: 22,
-    stroke: 3,
-    warning_limit: 50,
-};
-
 export default CircularProgress;
-
-CircularProgress.propTypes = {
-    className: PropTypes.string,
-    danger_limit: PropTypes.number,
-    is_clockwise: PropTypes.bool,
-    progress: PropTypes.number,
-    radius: PropTypes.number,
-    stroke: PropTypes.number,
-    warning_limit: PropTypes.number,
-    icon: PropTypes.string,
-};

packages/components/src/components/circular-progress/index.js → packages/components/src/components/circular-progress/index.ts

@@ -1,4 +1,4 @@
-import CircularProgress from './circular-progress.jsx';
+import CircularProgress from './circular-progress';
 import './circular-progress.scss';
 
 export default CircularProgress;