feat: add AccountTreeIcon component

[Rudra2637]

Description

This PR adds the AccountTreeIcon component to Sistent to reduce dependency on @mui/icons-material and ensure design consistency across Layer5 products. The icon preserves the exact UX in Meshery's index.ts component without visual regression.

Changes Made

• Created AccountTreeIcon component in src/icons/AccountTree/
• Added SVG path from Material-UI's AccountTree icon
• Updated src/icons/index.ts to export the new icon
• Verified component works with existing tests and build process

Related Issues

Fixes #1548

Testing

• ✅ npm run build - Build succeeds
• ✅ npm test - All 266 tests pass
• ✅ npm run lint - Code formatting verified
• ✅ No breaking changes to existing components

Notes for Reviewers

The AccountTreeIcon follows the existing Sistent icon pattern:

• Single SVG path from MUI's Material Icons
• Supports width/height customization via props
• Consistent with other icon implementations in the library

Signed commits

• Yes, I signed my commits with git commit -s

[gemini-code-assist]

Code Review

This pull request introduces the AccountTreeIcon component and updates the icon exports. Feedback suggests improving the component's consistency by using the DEFAULT_FILL constant, adjusting the indentation to two spaces as per the project's style guide, and fixing minor SVG formatting issues.

[gemini-code-assist]

The component has formatting inconsistencies and should use the DEFAULT_FILL constant for consistency with other icons in the library. Specifically, the closing > of the svg tag is on a new line, and the closing </svg> tag is incorrectly indented. Additionally, the indentation should be updated to 2 spaces to match the project's style guide as seen in constants.ts and types.ts.

import { DEFAULT_FILL, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { IconProps } from '../types';

export const AccountTreeIcon = ({
  width = DEFAULT_WIDTH,
  height = DEFAULT_HEIGHT,
  fill = DEFAULT_FILL,
  ...props
}: IconProps): JSX.Element => {
  return (
    <svg
      width={width}
      height={height}
      fill={fill}
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 24 24"
      {...props}>
      <path d="M22 11V3h-7v3H9V3H2v8h7V8h2v10h4v3h7v-8h-7v3h-2V8h2v3z" />
    </svg>
  );
};

export default AccountTreeIcon;

References

1. Use library constants for consistency and follow the project's 2-space indentation style guide. ^(link)