Skip to content

Commit

Permalink
fix(ui): Fix missing logo
Browse files Browse the repository at this point in the history
  • Loading branch information
Vu Van Duc authored and Vu Van Duc committed Mar 28, 2024
1 parent 735d3ac commit 71b8f7b
Show file tree
Hide file tree
Showing 6 changed files with 122 additions and 18 deletions.
16 changes: 8 additions & 8 deletions src/ui/pages/CredCardDetails/CredCardDetails.scss
View file
Expand Up @@ -20,14 +20,14 @@
height: 0;
overflow-y: hidden;
opacity: 0;
margin-top: -1.56rem;
margin-top: 0;
}

to {
height: 100vh;
overflow-y: hidden;
opacity: 1;
margin-top: -1.56rem;
margin-top: 0;
}
}
}
Expand All @@ -44,14 +44,14 @@
height: 100vh;
overflow-y: hidden;
opacity: 1;
margin-top: -1.56rem;
margin-top: 0;
}

to {
height: 0;
overflow-y: hidden;
opacity: 0;
margin-top: -1.56rem;
margin-top: 0;
}
}
}
Expand All @@ -65,13 +65,13 @@
height: 0;
overflow-y: hidden;
opacity: 0;
margin-top: -1.24rem;
margin-top: 0;
}
to {
height: 100vh;
overflow-y: hidden;
opacity: 1;
margin-top: -1.24rem;
margin-top: 0;
}
}
}
Expand All @@ -87,14 +87,14 @@
height: 100vh;
overflow-y: hidden;
opacity: 1;
margin-top: -1.24rem;
margin-top: 0;
}

to {
height: 0;
overflow-y: hidden;
opacity: 0;
margin-top: -1.24rem;
margin-top: 0;
}
}
}
Expand Down
12 changes: 6 additions & 6 deletions src/ui/pages/IdentifierCardDetails/IdentifierCardDetails.scss
View file
Expand Up @@ -101,11 +101,11 @@
}
}
}
}

.identifier-card-detail-spinner-container {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.identifier-card-detail-spinner-container {
height: calc(100vh - 102px);
display: flex;
justify-content: center;
align-items: center;
}
3 changes: 2 additions & 1 deletion src/ui/pages/IncomingRequest/components/ConnectionRequest.tsx
View file
Expand Up @@ -49,7 +49,8 @@ const ConnectionRequest = ({
</div>
<div className="request-provider-logo">
<img
src={requestData?.logo ?? CardanoLogo}
data-testid="request-provider-logo"
src={requestData?.logo || CardanoLogo}
alt="request-provider-logo"
/>
</div>
Expand Down
3 changes: 2 additions & 1 deletion src/ui/pages/IncomingRequest/components/CredentialRequest.tsx
View file
Expand Up @@ -49,7 +49,8 @@ const CredentialRequest = ({
</div>
<div className="request-provider-logo">
<img
src={requestData?.logo ?? CardanoLogo}
data-testid="credential-request-provider-logo"
src={requestData?.logo || CardanoLogo}
alt="request-provider-logo"
/>
</div>
Expand Down
6 changes: 4 additions & 2 deletions src/ui/pages/IncomingRequest/components/MultiSigRequestStageOne.tsx
View file
Expand Up @@ -74,8 +74,9 @@ const MultiSigRequestStageOne = ({
className="multisig-connection-logo"
>
<img
data-testid="multisig-connection-logo"
src={
requestData.multisigIcpDetails?.sender.logo ??
requestData.multisigIcpDetails?.sender.logo ||
CardanoLogo
}
alt="multisig-connection-logo"
Expand Down Expand Up @@ -114,7 +115,8 @@ const MultiSigRequestStageOne = ({
className="multisig-connection-logo"
>
<img
src={connection.logo ?? CardanoLogo}
data-testid={`other-multisig-connection-logo-${index}`}
src={connection.logo || CardanoLogo}
alt="multisig-connection-logo"
/>
</IonCol>
Expand Down
100 changes: 100 additions & 0 deletions src/ui/pages/IncomingRequest/components/RequestComponent.test.tsx
View file
Expand Up @@ -69,6 +69,33 @@ describe("Multi-Sig request", () => {
).toBeInTheDocument();
});

test("Display fallback when provider logo is empty for CONNECTION_INCOMING", async () => {
const testData = {
...requestData,
logo: "",
};
const { getByTestId } = render(
<Provider store={storeMocked}>
<RequestComponent
pageId={pageId}
activeStatus={activeStatus}
blur={blur}
setBlur={setBlur}
requestData={testData}
initiateAnimation={initiateAnimation}
handleAccept={handleAccept}
handleCancel={handleCancel}
handleIgnore={handleIgnore}
incomingRequestType={IncomingRequestType.CONNECTION_INCOMING}
/>
</Provider>
);

expect(getByTestId("request-provider-logo").getAttribute("src")).not.toBe(
undefined
);
});

test("It renders content for CREDENTIAL_OFFER_RECEIVED ", async () => {
const { getByText } = render(
<Provider store={storeMocked}>
Expand All @@ -92,6 +119,36 @@ describe("Multi-Sig request", () => {
).toBeInTheDocument();
});

test("Display fallback image when provider logo is empty: CREDENTIAL_OFFER_RECEIVED", async () => {
const testData = {
...requestData,
logo: "",
};

const { getByTestId } = render(
<Provider store={storeMocked}>
<RequestComponent
pageId={pageId}
activeStatus={activeStatus}
blur={blur}
setBlur={setBlur}
requestData={testData}
initiateAnimation={initiateAnimation}
handleAccept={handleAccept}
handleCancel={handleCancel}
handleIgnore={handleIgnore}
incomingRequestType={IncomingRequestType.CREDENTIAL_OFFER_RECEIVED}
/>
</Provider>
);

expect(getByTestId("credential-request-provider-logo")).toBeInTheDocument();

expect(
getByTestId("credential-request-provider-logo").getAttribute("src")
).not.toBe(undefined);
});

test("It renders content for MULTI_SIG_REQUEST_INCOMING - stage 0", async () => {
const { getByText } = render(
<Provider store={storeMocked}>
Expand All @@ -114,4 +171,47 @@ describe("Multi-Sig request", () => {
getByText(EN_TRANSLATIONS.request.multisig.stageone.title)
).toBeInTheDocument();
});

test("Display fallback image when provider logo is empty: CREDENTIAL_OFFER_RECEIVED MULTI_SIG_REQUEST_INCOMING - stage 0", async () => {
const testData = {
id: "abc123456",
type: IncomingRequestType.MULTI_SIG_REQUEST_INCOMING,
source: ConnectionType.KERI,
multisigIcpDetails: {
ourIdentifier: filteredKeriFix[0],
sender: {
...connectionsFix[3],
logo: "",
},
otherConnections: [
{
...connectionsFix[4],
logo: "",
},
connectionsFix[5],
],
threshold: 1,
},
};
const { getByTestId } = render(
<Provider store={storeMocked}>
<RequestComponent
pageId={pageId}
activeStatus={activeStatus}
blur={blur}
setBlur={setBlur}
requestData={testData}
initiateAnimation={initiateAnimation}
handleAccept={handleAccept}
handleCancel={handleCancel}
handleIgnore={handleIgnore}
incomingRequestType={IncomingRequestType.MULTI_SIG_REQUEST_INCOMING}
/>
</Provider>
);

expect(
getByTestId("multisig-connection-logo").getAttribute("src")
).not.toBe(undefined);
});
});

0 comments on commit 71b8f7b

Please sign in to comment.