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

Jump to bottom

Handle Declined proof (abandoned state callback) #406

Merged
merged 1 commit into from
Jan 26, 2024
Merged

Handle Declined proof (abandoned state callback) #406

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
1 change: 1 addition & 0 deletions oidc-controller/api/authSessions/models.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ class AuthSessionState(StrEnum):
EXPIRED = auto()
VERIFIED = auto()
FAILED = auto()
ABANDONED = auto()

class AuthSessionBase(BaseModel):
pres_exch_id: str
Expand Down
10 changes: 10 additions & 0 deletions oidc-controller/api/routers/acapy_handler.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,16 @@ async def post_topic(request: Request, topic: str, db: Database = Depends(get_db
await AuthSessionCRUD(db).patch(
str(auth_session.id), AuthSessionPatch(**auth_session.dict())
)

# abandoned state
if webhook_body["state"] == "abandoned":
logger.info("ABANDONED")
logger.info(webhook_body["error_msg"])
auth_session.proof_status = AuthSessionState.ABANDONED
await sio.emit("status", {"status": "abandoned"}, to=sid)
await AuthSessionCRUD(db).patch(
str(auth_session.id), AuthSessionPatch(**auth_session.dict())
)

# Calcuate the expiration time of the proof
now_time = datetime.now()
Expand Down
121 changes: 47 additions & 74 deletions oidc-controller/api/templates/verified_credentials.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,7 @@
.header-desc.success,
.header-desc.pending,
.header-desc.expired,
.header-desc.abandoned,
.header-desc.failed {
display: none;
border-radius: 0.5rem;
Expand Down Expand Up @@ -166,6 +167,9 @@
.header-desc.success {
background-color: #dff0d8;
}
.header-desc.abandoned {
background-color: #f2dede;
}
.header-desc a {
line-height: 1rem;
}
Expand Down Expand Up @@ -216,6 +220,18 @@ <h1>Scan with a Digital Wallet</h1>
</div>
</div>

<div class="header-desc abandoned">
<div class="qr-code-image">{{add_asset("circle-x.svg")}}</div>
<div class="qr-code-desc">
<b>Proof declined</b>
</br>
<a href="javascript:window.location.reload(true)"
title="Refresh QR code."
>Try again.</a
>
</div>
</div>

<div class="header-desc pending">
<div class="qr-code-image">{{add_asset("hourglass.svg")}}</div>
<div class="qr-code-desc">
Expand Down Expand Up @@ -273,93 +289,27 @@ <h1>Scan with a Digital Wallet</h1>
socket.connect();

const toggleState = (state) => {
const intro = document.querySelector(".intro");
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I refactored all this away to the setUiElements function below to generalize.

const success = document.querySelector(".success");
const pending = document.querySelector(".pending");
const failed = document.querySelector(".failed");
const expired = document.querySelector(".expired");
const qrcode = document.querySelector(".qr-code");
const scannedMask = document.querySelector(".scanned-mask");
const refreshButton = document.getElementById("refresh-button");

switch (state) {
case "intro":
// Header elements
intro.style.display = "grid";
success.style.display = "none";
pending.style.display = "none";
failed.style.display = "none";
expired.style.display = "none";

// Button elements
refreshButton.style.display = "none";

// Turn off the spinner
qrcode.classList.remove("pending");
setUiElements(".intro", false, false, false);
break;
case "verified":
// Header elements
intro.style.display = "none";
success.style.display = "grid";
pending.style.display = "none";
failed.style.display = "none";
expired.style.display = "none";

// Button elements
refreshButton.style.display = "none";
scannedMask.style.display = "flex";

// Turn off the spinner
qrcode.classList.remove("pending");

setUiElements(".success", false, true, false);
setTimeout(() => {
window.location.replace("{{callback_url}}", { method: "POST" });
}, 2000);
break;
case "failed":
// Header elements
intro.style.display = "none";
success.style.display = "none";
pending.style.display = "none";
failed.style.display = "grid";
expired.style.display = "none";

// Button elements
refreshButton.style.display = "flex";
scannedMask.style.display = "none";

// Turn off the spinner
qrcode.classList.remove("pending");
setUiElements(".failed", true, false, false);
break;
case "pending":
// Header elements
intro.style.display = "none";
success.style.display = "none";
pending.style.display = "grid";
failed.style.display = "none";
expired.style.display = "none";

// Button elements
refreshButton.style.display = "none";
scannedMask.style.display = "flex";

// Turn on the spinner
qrcode.classList.add("pending");
setUiElements(".pending", false, true, true);
break;
case "expired":
// Header elements
intro.style.display = "none";
success.style.display = "none";
pending.style.display = "none";
failed.style.display = "none";
expired.style.display = "grid";

// Button elements
refreshButton.style.display = "flex";
scannedMask.style.display = "none";

// Turn off the spinner
qrcode.classList.remove("pending");
setUiElements(".expired", true, false, false);
break;
case "abandoned":
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

New state

setUiElements(".abandoned", true, false, false);
break;
}
};
Expand All @@ -368,6 +318,29 @@ <h1>Scan with a Digital Wallet</h1>
location.reload(true);
});

/**
* Set the UI elements based on the current state
*/
const setUiElements = (state, showRefresh, showScanned, setSpinner) => {
const stateElement = document.querySelector(state);
const qrcode = document.querySelector(".qr-code");
const scannedMask = document.querySelector(".scanned-mask");
const refreshButton = document.getElementById("refresh-button");

// set all elements to display: none and display the current state
document.querySelectorAll(".header-desc").forEach((el) => {
el.style.display = "none";
});
stateElement.style.display = "grid";

// set the refresh and/or scanned overlays
refreshButton.style.display = showRefresh ? "flex" : "none";
scannedMask.style.display = showScanned ? "flex" : "none";

// add or remove 'pending' class from qrcode based on setSpinner
qrcode.classList.toggle("pending", setSpinner);
}

let timer;

/**
Expand Down