Feat: Render agent setting dialog #3221 (#9312)

### What problem does this PR solve?

Feat: Render agent setting dialog #3221
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/shared-badge.tsx

@@ -0,0 +1,16 @@
+import { useFetchUserInfo } from '@/hooks/user-setting-hooks';
+import { PropsWithChildren } from 'react';
+
+export function SharedBadge({ children }: PropsWithChildren) {
+  const { data: userInfo } = useFetchUserInfo();
+
+  if (typeof children === 'string' && userInfo.nickname === children) {
+    return null;
+  }
+
+  return (
+    <span className="bg-text-secondary rounded-sm px-1 text-bg-base text-xs">
+      {children}
+    </span>
+  );
+}