Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(app): fixed issuance preview screen in web #587

Merged
merged 1 commit into from
Sep 5, 2023
Merged

fix(app): fixed issuance preview screen in web #587

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 14 additions & 12 deletions demo/app/lib/views/issuance_preview.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,8 @@ class IssuancePreviewState extends State<IssuancePreview> {
String backgroundColor = '';
String issuerDisplayURL = '';
String textColor = '';
String? logoURL;
String? issuerLogoURL;
String logoURL = '';
String issuerLogoURL = '';

@override
void initState() {
Expand All @@ -51,9 +51,15 @@ class IssuancePreviewState extends State<IssuancePreview> {
credentialIssuer = response.first.credentialIssuer;
issuerDisplayName = response.first.localizedIssuerDisplays.first.name;
issuerDisplayURL = response.first.localizedIssuerDisplays.first.url;
issuerLogoURL = response.first.localizedIssuerDisplays.first.logo;
final issuerLogo = response.first.localizedIssuerDisplays.first.logo;
if (issuerLogo != null) {
issuerLogoURL = issuerLogo;
birtony marked this conversation as resolved.
Show resolved Hide resolved
}
credentialDisplayName = response.first.supportedCredentials.first.display.first.name;
logoURL = response.first.supportedCredentials.first.display.first.logo;
final logo = response.first.supportedCredentials.first.display.first.logo;
if (logo != null) {
logoURL = logo;
}
backgroundColor =
'0xff${response.first.supportedCredentials.first.display.first.backgroundColor.toString().replaceAll('#', '')}';
textColor =
Expand Down Expand Up @@ -83,10 +89,8 @@ class IssuancePreviewState extends State<IssuancePreview> {
"Add this credential ?"),
),
const SizedBox(height: 30),
issuerLogoURL == null
? const SizedBox.shrink()
: CachedNetworkImage(
imageUrl: issuerLogoURL!,
CachedNetworkImage(
imageUrl: issuerLogoURL,
placeholder: (context, url) => const CircularProgressIndicator(),
errorWidget: (context, url, error) =>
Image.asset('lib/assets/images/logoIcon.png', fit: BoxFit.cover),
Expand Down Expand Up @@ -135,10 +139,8 @@ class IssuancePreviewState extends State<IssuancePreview> {
),
textAlign: TextAlign.start,
),
leading: logoURL == null
? const SizedBox.shrink()
: CachedNetworkImage(
imageUrl: logoURL!,
leading: CachedNetworkImage(
imageUrl: logoURL,
placeholder: (context, url) => const CircularProgressIndicator(),
errorWidget: (context, url, error) =>
Image.asset('lib/assets/images/genericCredential.png', fit: BoxFit.contain),
Expand Down
20 changes: 9 additions & 11 deletions demo/app/lib/views/supported_credentials_list.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,11 +64,9 @@ class SupportedCredentialsListState extends State<SupportedCredentialsList> {
height: 80,
alignment: Alignment.center,
decoration: BoxDecoration(
color: convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.backgroundColor)
.isNotEmpty
color: (widget.supportedCredentialList.elementAt(index).display.first.backgroundColor != null)
? Color(int.parse(convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.backgroundColor)))
widget.supportedCredentialList.elementAt(index).display.first.backgroundColor!)))
: Colors.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [BoxShadow(offset: const Offset(3, 3), color: Colors.grey.shade300, blurRadius: 5)]),
Expand All @@ -78,19 +76,17 @@ class SupportedCredentialsListState extends State<SupportedCredentialsList> {
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.bold,
color: convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.textColor)
.isNotEmpty
color: (widget.supportedCredentialList.elementAt(index).display.first.textColor != null)
? Color(int.parse(convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.textColor)))
widget.supportedCredentialList.elementAt(index).display.first.textColor!)))
: const Color(0xff190C21),
),
textAlign: TextAlign.start,
),
leading: widget.supportedCredentialList.elementAt(index).display.first.logo == null
? const SizedBox.shrink()
: CachedNetworkImage(
imageUrl: widget.supportedCredentialList.elementAt(index).display.first.logo,
imageUrl: widget.supportedCredentialList.elementAt(index).display.first.logo!,
placeholder: (context, url) => const CircularProgressIndicator(),
errorWidget: (context, url, error) =>
Image.asset('lib/assets/images/genericCredential.png', fit: BoxFit.contain),
Expand All @@ -100,8 +96,10 @@ class SupportedCredentialsListState extends State<SupportedCredentialsList> {
),
trailing: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color(int.parse(convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.textColor))),
backgroundColor: (widget.supportedCredentialList.elementAt(index).display.first.textColor != null)
? Color(int.parse(convertToFlutterColor(
widget.supportedCredentialList.elementAt(index).display.first.textColor!)))
: Colors.white,
shadowColor: Colors.transparent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8), side: const BorderSide(color: Color(0xffC7C3C8))),
Expand Down
79 changes: 60 additions & 19 deletions demo/app/lib/wallet_sdk/wallet_sdk_js.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,40 @@ extension JSSupportedCredentialsExt on JSSupportedCredentials {
external List<dynamic> get display;
}

@JS()
@staticInterop
class JSIssuerMetadataLogo {}

extension JSIssuerMetadataLogoExt on JSIssuerMetadataLogo {
external String get alt_text;
external String get url;
}

@JS()
@staticInterop
class JSIssuerDisplayData {}

extension JSIssuerDisplayDataExt on JSIssuerDisplayData {
external String get name;
external String get locale;
external String get url;
external JSIssuerMetadataLogo? get logo;
external String? get text_color;
external String? get background_color;
}

@JS()
@staticInterop
class JSSupportedCredentialDisplayData {}

extension JSSupportedCredentialDisplayDataExt on JSSupportedCredentialDisplayData {
external String get name;
external String get locale;
external JSIssuerMetadataLogo? get logo;
external String? get text_color;
external String? get background_color;
}

@JS()
@staticInterop
class JSIssuerMetadata {}
Expand Down Expand Up @@ -323,32 +357,39 @@ class WalletSDK extends WalletPlatform {
Future<List<IssuerMetaData>> getIssuerMetaData() async {
final JSIssuerMetadata data = await promiseToFuture(jsGetIssuerMetadata());

final List<IssuerMetaData> issuerMetadata = [IssuerMetaData(
credentialIssuer: data.credentialIssuer,
supportedCredentials: data.supportedCredentials
final supportedCredentials = data.supportedCredentials
.map((e) => e as JSSupportedCredentials)
.map((supportedCredential) => SupportedCredentials(
format: supportedCredential.format,
types: supportedCredential.types.map((e) => e as String).toList(),
display: supportedCredential.display
format: supportedCredential.format,
types: supportedCredential.types.map((e) => e as String).toList(),
display: supportedCredential.display
.map((e) => e as JSSupportedCredentialDisplayData)
.map((supportedCredentialDisplayData) => SupportedCredentialDisplayData(
name: supportedCredentialDisplayData.name,
locale: supportedCredentialDisplayData.locale,
logo: (supportedCredentialDisplayData.logo != null) ? supportedCredentialDisplayData.logo.url : '',
logo: supportedCredentialDisplayData.logo?.url,
textColor: supportedCredentialDisplayData.text_color,
backgroundColor: supportedCredentialDisplayData.background_color
)
).toList(),
)).toList(),
localizedIssuerDisplays: data.localizedIssuerDisplays
.map((localizedIssuerDisplay) => IssuerDisplayData(
name: localizedIssuerDisplay.name,
locale: localizedIssuerDisplay.locale,
url: (localizedIssuerDisplay.url != null) ? localizedIssuerDisplay.url : '',
logo: (localizedIssuerDisplay.logo != null) ? localizedIssuerDisplay.logo.url : '',
textColor: localizedIssuerDisplay.text_color,
backgroundColor: localizedIssuerDisplay.background_color
)).toList(),
)
).toList(),
)).toList();


final localizedIssuerDisplays = data.localizedIssuerDisplays
.map((e) => e as JSIssuerDisplayData)
.map((localizedIssuerDisplay) => IssuerDisplayData(
name: localizedIssuerDisplay.name,
locale: localizedIssuerDisplay.locale,
url: localizedIssuerDisplay.url,
logo: localizedIssuerDisplay.logo?.url,
textColor: localizedIssuerDisplay.text_color,
backgroundColor: localizedIssuerDisplay.background_color
)).toList();

final List<IssuerMetaData> issuerMetadata = [IssuerMetaData(
credentialIssuer: data.credentialIssuer,
supportedCredentials: supportedCredentials,
localizedIssuerDisplays: localizedIssuerDisplays,
)];

debugPrint("Issuer Metadata: $issuerMetadata");
Expand Down
12 changes: 6 additions & 6 deletions demo/app/lib/wallet_sdk/wallet_sdk_model.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -201,16 +201,16 @@ class SupportedCredentials {
class SupportedCredentialDisplayData {
final String name;
final String locale;
final String logo;
final String textColor;
final String backgroundColor;
final String? logo;
final String? textColor;
final String? backgroundColor;

const SupportedCredentialDisplayData({
required this.name,
required this.locale,
required this.logo,
required this.textColor,
required this.backgroundColor,
this.logo,
this.textColor,
this.backgroundColor,
});

@override
Expand Down
Loading