fix functional component name

beyaz · Feb 18, 2024 · 7f733a5 · 7f733a5
1 parent 8720e81
commit 7f733a5
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/ReactWithDotNet.WebSite/wwwroot/react-with-dotnet/react-with-dotnet.jsx b/ReactWithDotNet.WebSite/wwwroot/react-with-dotnet/react-with-dotnet.jsx
@@ -2024,6 +2024,10 @@ function DefineComponent(componentDeclaration)
     ComponentDefinitions[dotNetTypeOfReactComponent] = NewComponent;
 
     NewComponent.displayName = dotNetTypeOfReactComponent.split(',')[0].split('.').pop();
+    if (NewComponent.displayName === 'FunctionalComponent')
+    {
+        NewComponent.displayName = componentDeclaration[DotNetProperties].Name;
+    }
 
     return NewComponent;
 }

diff --git a/ReactWithDotNet/FC.cs b/ReactWithDotNet/FC.cs
@@ -16,7 +16,7 @@ public interface IFunctionalComponent
 
 partial class Mixin
 {
-    public static Element FC(Func<IFunctionalComponent, Element> func)
+    public static Element FC(Func<IFunctionalComponent, Element> func, [CallerMemberName] string callerMemberName = null)
     {
         if (func == null)
         {
@@ -35,15 +35,18 @@ public static Element FC(Func<IFunctionalComponent, Element> func)
 
                     RenderMethodNameWithToken = func.Method.GetNameWithToken(),
 
-                    CompilerGeneratedType = targeType
+                    CompilerGeneratedType = targeType,
+
+                    Name = $"{targeType.DeclaringType?.Name}.{callerMemberName}"
+
                 };
             }
         }
 
         throw DeveloperException("Invalid usage of Functional component");
     }
 
-    public static Element FC(Func<IFunctionalComponent, Task<Element>> func)
+    public static Element FC(Func<IFunctionalComponent, Task<Element>> func, [CallerMemberName] string callerMemberName = null)
     {
         if (func == null)
         {
@@ -66,7 +69,9 @@ public static Element FC(Func<IFunctionalComponent, Task<Element>> func)
 
                     RenderMethodNameWithToken = func.Method.GetNameWithToken(),
 
-                    CompilerGeneratedType = targeType
+                    CompilerGeneratedType = targeType,
+
+                    Name = $"{targeType.DeclaringType?.Name}.{callerMemberName}"
                 };
             }
         }
@@ -283,6 +288,8 @@ sealed class FunctionalComponent : Component<FunctionalComponent.State>, IFuncti
     public string RenderMethodNameWithToken { get; init; }
 
     public bool IsAsyncFC { get; init; }
+
+    public required string Name { get; init; }
 
     public void InitializeTarget()
     {

diff --git a/ReactWithDotNet/JsClientEngine/react-with-dotnet/react-with-dotnet.jsx b/ReactWithDotNet/JsClientEngine/react-with-dotnet/react-with-dotnet.jsx
@@ -2024,6 +2024,10 @@ function DefineComponent(componentDeclaration)
     ComponentDefinitions[dotNetTypeOfReactComponent] = NewComponent;
 
     NewComponent.displayName = dotNetTypeOfReactComponent.split(',')[0].split('.').pop();
+    if (NewComponent.displayName === 'FunctionalComponent')
+    {
+        NewComponent.displayName = componentDeclaration[DotNetProperties].Name;
+    }
 
     return NewComponent;
 }