Merge pull request #466 from tianenpang/fix/user-prop-tag

fix(react-user): prop and link warnings
nextui-org · Jun 6, 2022 · 5eee8a9 · 5eee8a9
2 parents 43f48f8 + 1f31659
commit 5eee8a9
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 37 deletions.
diff --git a/packages/react/src/user/index.ts b/packages/react/src/user/index.ts
@@ -10,8 +10,7 @@ export {
   StyledUser,
   StyledUserInfo,
   StyledUserName,
-  StyledUserDesc,
-  StyledUserLink
+  StyledUserDesc
 } from './user.styles';
 
 export default User;
diff --git a/packages/react/src/user/user-link.tsx b/packages/react/src/user/user-link.tsx
@@ -1,35 +1,37 @@
 import React from 'react';
 import Link from '../link';
-import { StyledUserLink } from './user.styles';
-import { CSS } from '../theme/stitches.config';
+import clsx from '../utils/clsx';
 import { __DEV__ } from '../utils/assertion';
+import type { LinkProps } from '../link';
 
 interface Props {
-  href?: string;
+  children?: React.ReactNode;
 }
-type NativeAttrs = Omit<React.AnchorHTMLAttributes<unknown>, keyof Props>;
-export type UserLinkProps = Props & NativeAttrs & { css?: CSS };
-
-const UserLink = React.forwardRef<
-  HTMLAnchorElement,
-  React.PropsWithChildren<UserLinkProps>
->(
-  (
-    { href, className, children, ...props },
-    ref: React.Ref<HTMLAnchorElement>
-  ) => {
+
+export type UserLinkProps = Props & Omit<LinkProps, 'icon'>;
+
+const UserLink = React.forwardRef<HTMLAnchorElement, UserLinkProps>(
+  (props: UserLinkProps, ref: React.Ref<HTMLAnchorElement>) => {
+    const {
+      rel = 'noopener',
+      color = 'primary',
+      target = '_blank',
+      className,
+      children,
+      ...otherProps
+    } = props;
+
     return (
-      <StyledUserLink {...props}>
-        <Link
-          ref={ref}
-          href={href}
-          color="primary"
-          target="_blank"
-          rel="noopener"
-        >
-          {children}
-        </Link>
-      </StyledUserLink>
+      <Link
+        ref={ref}
+        rel={rel}
+        color={color}
+        target={target}
+        className={clsx('nextui-user-link', className)}
+        {...otherProps}
+      >
+        {children}
+      </Link>
     );
   }
 );

diff --git a/packages/react/src/user/user.styles.ts b/packages/react/src/user/user.styles.ts
@@ -53,11 +53,3 @@ export const StyledUserDesc = styled('span', {
     mb: 0
   }
 });
-
-export const StyledUserLink = styled('a', {
-  a: {
-    '&:hover': {
-      opacity: 0.7
-    }
-  }
-});
diff --git a/packages/react/src/user/user.tsx b/packages/react/src/user/user.tsx
@@ -64,6 +64,8 @@ export const User = React.forwardRef(
       bordered,
       size,
       description,
+      zoomed,
+      pointer,
       ...otherProps
     } = props;
 
@@ -99,8 +101,8 @@ export const User = React.forwardRef(
           src={src}
           color={color}
           squared={squared}
-          zoomed={props.zoomed}
-          pointer={props.pointer}
+          zoomed={zoomed}
+          pointer={pointer}
           bordered={bordered}
           text={text}
           size={size}