feat(logo)

- add logo on the profile name card

lib/arns/domain/arns_repository.dart

@@ -32,7 +32,8 @@ abstract class ARNSRepository {
   Future<void> saveAllFilesWithAssignedNames();
   Future<List<ArnsRecord>> getActiveARNSRecordsForFile(String fileId);
   Future<void> waitForARNSRecordsToUpdate();
-  Future<String> getPrimaryName(String address, {bool update = false});
+  Future<PrimaryNameDetails> getPrimaryName(String address,
+      {bool update = false});
 
   factory ARNSRepository({
     required ArioSDK sdk,
@@ -89,7 +90,7 @@ class _ARNSRepository implements ARNSRepository {
   }
 
   final Map<String, Map<String, ARNSUndername>> _cachedUndernames = {};
-  String? _cachedPrimaryName;
+  PrimaryNameDetails? _cachedPrimaryName;
 
   @override
   Future<void> setUndernamesToFile({
@@ -375,14 +376,15 @@ class _ARNSRepository implements ARNSRepository {
   }
 
   @override
-  Future<String> getPrimaryName(String address, {bool update = false}) async {
+  Future<PrimaryNameDetails> getPrimaryName(String address,
+      {bool update = false}) async {
     logger.d('Getting primary name for address: $address');
 
     if (!update && _cachedPrimaryName != null) {
       return _cachedPrimaryName!;
     }
 
-    final primaryName = await _sdk.getPrimaryName(address);
+    final primaryName = await _sdk.getPrimaryNameDetails(address);
 
     logger.d('Primary name: $primaryName');
 

lib/components/profile_card.dart

@@ -552,7 +552,7 @@ class _ProfileCardState extends State<ProfileCard> {
     return BlocBuilder<ProfileNameBloc, ProfileNameState>(
       builder: (context, state) {
         final primaryName = state is ProfileNameLoaded
-            ? state.primaryName
+            ? state.primaryNameDetails.primaryName
             : truncateString(walletAddress, offsetStart: 2, offsetEnd: 2);
         double maxWidth = 100;
 
@@ -574,12 +574,47 @@ class _ProfileCardState extends State<ProfileCard> {
           tooltipMessage = primaryName;
         }
 
+        Widget? icon;
+
+        if (state is ProfileNameLoaded) {
+          if (state.primaryNameDetails.logo != null) {
+            icon = ArDriveImage(
+              image: NetworkImage(
+                  'https://arweave.net/${state.primaryNameDetails.logo}'),
+              width: 24,
+              height: 24,
+            );
+          }
+        }
+
+        Widget? content;
+
+        if (icon != null) {
+          content = Row(
+            children: [
+              icon,
+              const SizedBox(width: 8),
+              Flexible(
+                child: Text(
+                  primaryName,
+                  overflow: TextOverflow.ellipsis,
+                  maxLines: 1,
+                  style: typography.paragraphLarge(
+                    fontWeight: ArFontWeight.semiBold,
+                  ),
+                ),
+              ),
+            ],
+          );
+        }
+
         return ArDriveTooltip(
           message: tooltipMessage ?? '',
           child: ArDriveButtonNew(
             text: primaryName,
             typography: typography,
             variant: ButtonVariant.outline,
+            content: content,
             maxWidth: maxWidth,
             maxHeight: 40,
             onPressed: () {

lib/user/name/presentation/bloc/profile_name_state.dart

@@ -24,15 +24,15 @@ final class ProfileNameLoading extends ProfileNameState {
 }
 
 final class ProfileNameLoaded extends ProfileNameState {
-  final String primaryName;
+  final PrimaryNameDetails primaryNameDetails;
 
-  const ProfileNameLoaded(this.primaryName, this.walletAddress);
+  const ProfileNameLoaded(this.primaryNameDetails, this.walletAddress);
 
   @override
   final String walletAddress;
 
   @override
-  List<Object> get props => [primaryName, walletAddress];
+  List<Object> get props => [primaryNameDetails, walletAddress];
 }
 
 // if fails to load primary name, show current wallet address

packages/ardrive_ui/lib/src/components/button.dart

@@ -270,6 +270,7 @@ class ArDriveButtonNew extends StatefulWidget {
     this.hoverIcon,
     this.isDisabled = false,
     this.customContent,
+    this.content,
   });
 
   final String text;
@@ -282,6 +283,7 @@ class ArDriveButtonNew extends StatefulWidget {
   final double? maxWidth;
   final double borderRadius;
   final bool isDisabled;
+  final Widget? content;
 
   /// An optional icon to display to the left of the button text.
   /// Only applies to primary and secondary buttons.
@@ -378,43 +380,66 @@ class _ArDriveButtonNewState extends State<ArDriveButtonNew> {
 
     final buttonH = widget.maxHeight ?? buttonDefaultHeight;
 
+    if (widget.content != null) {
+      return SizedBox(
+        height: buttonH,
+        width: widget.maxWidth,
+        child: TextButton(
+          onPressed: widget.onPressed,
+          style: style,
+          child: widget.content!,
+        ),
+      );
+    }
+
     return SizedBox(
         height: buttonH,
         width: widget.maxWidth,
         child: Stack(fit: StackFit.expand, children: [
-          TextButton(
-              onPressed: widget.isDisabled ? null : widget.onPressed,
-              onHover: widget.hoverIcon == null || isMobile(context)
-                  ? null
-                  : (hovering) {
-                      setState(() {
-                        offsetY = hovering ? -1 : 0;
-                      });
-                    },
-              style: style,
-              child: widget.hoverIcon == null || isMobile(context)
-                  ? isMobile(context) && buttonH < 45
-                      ? Transform.translate(
-                          offset: const Offset(0, -2), child: text)
-                      : text
-                  : Stack(
-                      fit: StackFit.expand,
-                      alignment: Alignment.center,
-                      children: [
-                        AnimatedPositioned(
-                            // FIXME: this is a hack to make the text align properly
-                            // and will need to be updated for different typography
-                            top: 12 + offsetY * buttonH,
-                            duration: const Duration(milliseconds: 100),
-                            child: SizedBox(height: buttonH, child: text)),
-                        if (widget.hoverIcon != null)
-                          AnimatedSlide(
-                            offset: Offset(0, offsetY + 1),
-                            duration: const Duration(milliseconds: 100),
-                            child: widget.hoverIcon!,
-                          )
-                      ],
-                    )),
+          Padding(
+            padding: EdgeInsets.only(
+                left: widget.icon != null ? 24 : 0,
+                right: widget.icon != null ? 24 : 0),
+            child: TextButton(
+                onPressed: widget.isDisabled ? null : widget.onPressed,
+                onHover: widget.hoverIcon == null || isMobile(context)
+                    ? null
+                    : (hovering) {
+                        setState(() {
+                          offsetY = hovering ? -1 : 0;
+                        });
+                      },
+                style: style,
+                child: widget.hoverIcon == null || isMobile(context)
+                    ? isMobile(context) && buttonH < 45
+                        ? Transform.translate(
+                            offset: const Offset(0, -2), child: text)
+                        : text
+                    : Stack(
+                        fit: StackFit.expand,
+                        alignment: Alignment.center,
+                        children: [
+                          AnimatedPositioned(
+                              // FIXME: this is a hack to make the text align properly
+                              // and will need to be updated for different typography
+                              top: 12 + offsetY * buttonH,
+                              duration: const Duration(milliseconds: 100),
+                              child: SizedBox(height: buttonH, child: text)),
+                          if (widget.hoverIcon != null)
+                            AnimatedSlide(
+                              offset: Offset(0, offsetY + 1),
+                              duration: const Duration(milliseconds: 100),
+                              child: widget.hoverIcon!,
+                            )
+                        ],
+                      )),
+          ),
+          if (widget.icon != null)
+            Container(
+              alignment: Alignment.centerLeft,
+              padding: const EdgeInsets.only(left: 32),
+              child: widget.icon!,
+            ),
           if (widget.rightIcon != null)
             Container(
               alignment: Alignment.centerRight,

packages/ardrive_ui/lib/src/components/image.dart

@@ -9,6 +9,8 @@ class ArDriveImage extends StatelessWidget {
   final Color? color;
   final Animation<double>? opacity;
   final BlendMode? colorBlendMode;
+  final Widget Function(BuildContext, Object, StackTrace?)? errorBuilder;
+
   const ArDriveImage({
     super.key,
     required this.image,
@@ -19,6 +21,7 @@ class ArDriveImage extends StatelessWidget {
     this.color,
     this.opacity,
     this.colorBlendMode,
+    this.errorBuilder,
   });
 
   @override
@@ -31,6 +34,7 @@ class ArDriveImage extends StatelessWidget {
         image: image,
         height: height,
         width: width,
+        imageErrorBuilder: errorBuilder,
       );
     }
     return Image(
@@ -42,6 +46,7 @@ class ArDriveImage extends StatelessWidget {
       filterQuality: FilterQuality.high,
       opacity: opacity,
       colorBlendMode: colorBlendMode,
+      errorBuilder: errorBuilder,
     );
   }
 }

packages/ario_sdk/lib/src/ario_sdk.dart

@@ -31,5 +31,5 @@ abstract class ArioSDK {
   /// Get the primary name for the given address
   ///
   /// Throws [PrimaryNameNotFoundException] if the primary name is not found
-  Future<String> getPrimaryName(String address);
+  Future<PrimaryNameDetails> getPrimaryNameDetails(String address);
 }

packages/ario_sdk/lib/src/implementations/ario_sdk_web.dart

@@ -98,11 +98,11 @@ class ArioSDKWeb implements ArioSDK {
   }
 
   @override
-  Future<String> getPrimaryName(String address) async {
+  Future<PrimaryNameDetails> getPrimaryNameDetails(String address) async {
     final primaryName = await _getPrimaryNameImpl(address);
 
-    if (primaryName.contains('Primary name data not found')) {
-      throw PrimaryNameNotFoundException(primaryName);
+    if (primaryName.primaryName.contains('Primary name data not found')) {
+      throw PrimaryNameNotFoundException(primaryName.primaryName);
     }
 
     return primaryName;
@@ -200,14 +200,18 @@ Future<List<ARNSProcessData>> _getARNSRecordsForWalletImpl(
   return object.data.values.toList();
 }
 
-@JS('getPrimaryName')
-external Object _getPrimaryName(String address);
+@JS('getPrimaryNameAndLogo')
+external Object _getPrimaryNameAndLogo(String address);
 
-Future<String> _getPrimaryNameImpl(String address) async {
-  final promise = _getPrimaryName(address);
+Future<PrimaryNameDetails> _getPrimaryNameImpl(String address) async {
+  final promise = _getPrimaryNameAndLogo(address);
   final stringified = await promiseToFuture(promise);
 
   final json = jsonDecode(stringified);
 
-  return json['name'];
+  return PrimaryNameDetails(
+    primaryName: json['primaryName']['name'],
+    logo: json['antInfo']['Logo'],
+    recordId: json['arnsRecord']?['processId'],
+  );
 }

packages/ario_sdk/lib/src/implementations/ario_sdk_web_stub.dart

@@ -45,7 +45,7 @@ class ArioSDKWeb implements ArioSDK {
   }
 
   @override
-  Future<String> getPrimaryName(String address) {
+  Future<PrimaryNameDetails> getPrimaryNameDetails(String address) {
     // TODO: implement getPrimaryName
     throw UnimplementedError();
   }

packages/ario_sdk/lib/src/models/models.dart

@@ -2,3 +2,4 @@ export 'ant_record.dart';
 export 'arns_record.dart';
 export 'gateway.dart';
 export 'undername.dart';
+export 'primary_name_details.dart';

packages/ario_sdk/lib/src/models/primary_name_details.dart

@@ -0,0 +1,11 @@
+class PrimaryNameDetails {
+  final String primaryName;
+  final String? logo;
+  final String? recordId;
+
+  PrimaryNameDetails({
+    required this.primaryName,
+    this.logo,
+    this.recordId,
+  });
+}

packages/ario_sdk/web/dist/index.js

@@ -121627,7 +121627,7 @@ window.ario = {
     setAnt: $6efb768676258e07$var$setAnt,
     getUndernames: $6efb768676258e07$var$getUndernames,
     getARNSRecordsForWallet: $6efb768676258e07$var$getARNSRecordsForWallet,
-    getPrimaryName: $6efb768676258e07$var$getPrimaryName
+    getPrimaryNameAndLogo: $6efb768676258e07$var$getPrimaryNameAndLogo
 };
 const $6efb768676258e07$var$io = (0, $5E3On.IO).init({
     process: new (0, $5E3On.AOProcess)({
@@ -121746,12 +121746,30 @@ async function $6efb768676258e07$var$getProcesses(address) {
         });
     });
 }
-async function $6efb768676258e07$var$getPrimaryName(address) {
-    console.log('Fetching primary name for address:', address);
-    const result = await $6efb768676258e07$var$io.getPrimaryName({
+async function $6efb768676258e07$var$getPrimaryNameAndLogo(address) {
+    const primaryName = await $6efb768676258e07$var$io.getPrimaryName({
         address: address
     });
-    return JSON.stringify(result);
+    const record = await $6efb768676258e07$var$io.getArNSRecord({
+        name: primaryName.name
+    }).catch((e)=>{
+        console.error('Error fetching ARNS record:', e);
+        return null;
+    });
+    const ant = (0, $5E3On.ANT).init({
+        processId: record.processId
+    });
+    const info = !record ? null : await ant.getInfo().catch((e)=>{
+        console.error('Error fetching ANT info:', e);
+        return null;
+    });
+    // antInfo can be null
+    // arnsRecord can be null
+    return JSON.stringify({
+        primaryName: primaryName,
+        antInfo: info,
+        arnsRecord: record
+    });
 }
 
 })();