refactor(custom-chart-web): rename to custom-chart-web

Author: rahmanunver

packages/pluggableWidgets/any-chart-web/src/AnyChart.tsx

@@ -1,6 +1,6 @@
 {
-    "name": "@mendix/any-chart-web2",
-    "widgetName": "AnyChart",
+    "name": "@mendix/custom-chart-web",
+    "widgetName": "CustomChart",
     "version": "1.0.0",
     "description": "",
     "copyright": "© Mendix Technology BV 2024. All rights reserved.",
@@ -14,18 +14,18 @@
         "developmentPort": 3000
     },
     "mxpackage": {
-        "name": "AnyChart",
+        "name": "CustomChart",
         "type": "widget",
-        "mpkName": "com.mendix.widget.web.AnyChart.mpk"
+        "mpkName": "com.mendix.widget.web.CustomChart.mpk"
     },
     "marketplace": {
         "minimumMXVersion": "10.16.0",
         "appNumber": 1234,
-        "appName": "AnyChart"
+        "appName": "CustomChart"
     },
     "testProject": {
         "githubUrl": "https://github.com/mendix/testProjects",
-        "branchName": "any-chart-web"
+        "branchName": "custom-chart-web"
     },
     "packagePath": "com.mendix.widget.web",
     "scripts": {
@@ -34,9 +34,9 @@
         "build": "pluggable-widgets-tools build:web",
         "format": "pluggable-widgets-tools format",
         "lint": "eslint --ext .jsx,.js,.ts,.tsx src/",
-        "test": "echo 'FIXME: Finish any-chart-web unit test migration'",
-        "e2e": "echo 'FIXME: Finish any-chart-web e2e test migration'",
-        "e2edev": "echo 'FIXME: Finish any-chart-web e2e test migration'",
+        "test": "echo 'FIXME: Finish custom-chart-web unit test migration'",
+        "e2e": "echo 'FIXME: Finish custom-chart-web e2e test migration'",
+        "e2edev": "echo 'FIXME: Finish custom-chart-web e2e test migration'",
         "release": "pluggable-widgets-tools release:web",
         "create-gh-release": "rui-create-gh-release",
         "publish-marketplace": "rui-publish-marketplace",

packages/pluggableWidgets/any-chart-web/src/package.xml

@@ -2,9 +2,9 @@ import {
     StructurePreviewProps,
     structurePreviewPalette
 } from "@mendix/widget-plugin-platform/preview/structure-preview-api";
-import { AnyChartPreviewProps } from "../typings/AnyChartProps";
+import { CustomChartPreviewProps } from "../typings/CustomChartProps";
 
-export function getPreview(_values: AnyChartPreviewProps, isDarkMode: boolean): StructurePreviewProps {
+export function getPreview(_values: CustomChartPreviewProps, isDarkMode: boolean): StructurePreviewProps {
     const palette = structurePreviewPalette[isDarkMode ? "dark" : "light"];
     const sampleChartSvg = `
         <svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">

packages/pluggableWidgets/any-chart-web/src/ui/AnyChart.scss

@@ -1,6 +1,6 @@
 import { ReactElement, createElement } from "react";
-import { AnyChartPreviewProps } from "../typings/AnyChartProps";
-import AnyChart from "./AnyChart";
+import { CustomChartPreviewProps } from "../typings/CustomChartProps";
+import CustomChart from "./CustomChart";
 
 const defaultSampleData = `[{
     "type": "scatter",
@@ -38,7 +38,7 @@ const defaultConfig = `{
     "staticPlot": true
 }`;
 
-export function preview(props: AnyChartPreviewProps): ReactElement {
+export function preview(props: CustomChartPreviewProps): ReactElement {
     const containerProps = {
         name: "preview-chart",
         class: props.class,
@@ -56,5 +56,5 @@ export function preview(props: AnyChartPreviewProps): ReactElement {
         height: props.height || 75
     };
 
-    return <AnyChart {...containerProps} />;
+    return <CustomChart {...containerProps} />;
 }

packages/pluggableWidgets/any-chart-web/.eslintrc.json renamed to packages/pluggableWidgets/custom-chart-web/.eslintrc.json

@@ -0,0 +1,10 @@
+import { ReactElement, createElement } from "react";
+import { CustomChartContainerProps } from "../typings/CustomChartProps";
+import { useCustomChart } from "./hooks/useCustomChart";
+import "./ui/CustomChart.scss";
+
+export default function CustomChart(props: CustomChartContainerProps): ReactElement {
+    const { chartRef, containerStyle } = useCustomChart(props);
+
+    return <div ref={chartRef} className="widget-custom-chart" style={containerStyle} tabIndex={props.tabIndex} />;
+}

packages/pluggableWidgets/any-chart-web/.prettierrc.js renamed to packages/pluggableWidgets/custom-chart-web/.prettierrc.js

@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<widget id="com.mendix.widget.web.anychart.AnyChart" pluginWidget="true" offlineCapable="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../node_modules/mendix/custom_widget.xsd">
-    <name>Any chart</name>
-    <description>Create any chart</description>
+<widget id="com.mendix.widget.web.custom-chart.CustomChart" pluginWidget="true" offlineCapable="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../node_modules/mendix/custom_widget.xsd">
+    <name>Custom chart</name>
+    <description>Create a custom chart</description>
     <studioProCategory>Charts</studioProCategory>
     <studioCategory>Charts</studioCategory>
     <properties>

packages/pluggableWidgets/any-chart-web/README.md renamed to packages/pluggableWidgets/custom-chart-web/README.md

@@ -1,18 +1,18 @@
 import { debounce } from "@mendix/widget-plugin-platform/utils/debounce";
 import { useEffect, useMemo, useRef, useState, type RefObject } from "react";
-import { AnyChartContainerProps } from "../../typings/AnyChartProps";
+import { CustomChartContainerProps } from "../../typings/CustomChartProps";
 import { PlotlyChart } from "../components/PlotlyChart";
 import { ChartDataProcessor } from "../utils/ChartDataProcessor";
 
-interface UseAnyChartReturn {
+interface UseCustomChartReturn {
     chartRef: RefObject<HTMLDivElement>;
     containerStyle: {
         width?: string;
         height?: string;
     };
 }
 
-export function useAnyChart(props: AnyChartContainerProps): UseAnyChartReturn {
+export function useCustomChart(props: CustomChartContainerProps): UseCustomChartReturn {
     const chartRef = useRef<HTMLDivElement>(null);
     const [chart, setChart] = useState<PlotlyChart | null>(null);
     const [containerDimensions, setContainerDimensions] = useState<{ width?: number; height?: number }>({});

packages/pluggableWidgets/any-chart-web/package.json renamed to packages/pluggableWidgets/custom-chart-web/package.json

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<package xmlns="http://www.mendix.com/package/1.0/">
+    <clientModule name="CustomChart" version="1.0.0" xmlns="http://www.mendix.com/clientModule/1.0/">
+        <widgetFiles>
+            <widgetFile path="CustomChart.xml" />
+        </widgetFiles>
+        <files>
+            <file path="com/mendix/widget/web/custom-chart" />
+        </files>
+    </clientModule>
+</package>

packages/pluggableWidgets/any-chart-web/src/AnyChart.editorConfig.ts renamed to packages/pluggableWidgets/custom-chart-web/src/CustomChart.editorConfig.ts

@@ -0,0 +1,4 @@
+.widget-custom-chart {
+    width: 100%;
+    height: 100%;
+}

packages/pluggableWidgets/any-chart-web/src/AnyChart.editorPreview.tsx renamed to packages/pluggableWidgets/custom-chart-web/src/CustomChart.editorPreview.tsx

@@ -1,5 +1,5 @@
 /**
- * This file was generated from AnyChart.xml
+ * This file was generated from CustomChart.xml
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
@@ -12,7 +12,7 @@ export type WidthUnitEnum = "percentage" | "pixels";
 
 export type HeightUnitEnum = "percentageOfWidth" | "pixels" | "percentageOfParent";
 
-export interface AnyChartContainerProps {
+export interface CustomChartContainerProps {
     name: string;
     class: string;
     style?: CSSProperties;
@@ -31,7 +31,7 @@ export interface AnyChartContainerProps {
     height: number;
 }
 
-export interface AnyChartPreviewProps {
+export interface CustomChartPreviewProps {
     /**
      * @deprecated Deprecated since version 9.18.0. Please use class property instead.
      */