diff --git a/app/components/identity/step2.hbs b/app/components/identity/step2.hbs
new file mode 100644
index 00000000..f1ab80ad
--- /dev/null
+++ b/app/components/identity/step2.hbs
@@ -0,0 +1,21 @@
+
Step 2: Profile
+ Service URL
+Set the chaincode on your
+ profile service, deploy it and enter your profile service URL.
+
+{{#if this.profileURL}}
+
+{{/if}}
\ No newline at end of file
diff --git a/app/components/identity/step2.js b/app/components/identity/step2.js
new file mode 100644
index 00000000..5793e42a
--- /dev/null
+++ b/app/components/identity/step2.js
@@ -0,0 +1,73 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { toastNotificationTimeoutOptions } from '../../constants/toast-notification';
+import { APPS } from '../../constants/urls';
+
+const BASE_URL = APPS.API_BACKEND;
+
+export default class Step2Component extends Component {
+ @tracked profileURL = this.args.profileURL || '';
+ @tracked savingURL = false;
+ @service toast;
+
+ @action async handleNext() {
+ const isValidUrl = (str) => {
+ try {
+ const newUrl = new URL(str);
+ return newUrl.protocol === 'https:';
+ } catch (err) {
+ return false;
+ }
+ };
+ if (this.profileURL) {
+ if (isValidUrl(this.profileURL)) {
+ if (this.savingURL === false) {
+ if (this.profileURL === this.args.profileURL) {
+ this.args.setState('step3');
+ return;
+ }
+ this.savingURL = true;
+ try {
+ const response = await fetch(`${BASE_URL}/users/profileURL`, {
+ method: 'PATCH',
+ body: JSON.stringify({ profileURL: this.profileURL }),
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+ credentials: 'include',
+ });
+ if (response.ok) {
+ this.toast.info(
+ 'Updated profile URL!!',
+ '',
+ toastNotificationTimeoutOptions,
+ );
+ this.args.setState('step3');
+ } else {
+ this.toast.error(
+ 'Something went wrong. Please check console errors.',
+ '',
+ toastNotificationTimeoutOptions,
+ );
+ }
+ } catch (error) {
+ console.error(error);
+ this.toast.error(
+ 'Something went wrong. Please check console errors.',
+ '',
+ toastNotificationTimeoutOptions,
+ );
+ } finally {
+ this.savingURL = false;
+ }
+ }
+ } else {
+ alert(
+ 'Invalid URL! Make sure you entered the correct https profile URL.',
+ );
+ }
+ }
+ }
+}
diff --git a/app/controllers/identity.js b/app/controllers/identity.js
index 49bb7347..6b7509b6 100644
--- a/app/controllers/identity.js
+++ b/app/controllers/identity.js
@@ -8,11 +8,12 @@ export default class IdentityController extends Controller {
@tracked userData = null;
@tracked state = 'getStarted';
-
+ @tracked profileURL = null;
constructor() {
super(...arguments);
this.userData = this.login.userData;
this.state = this.initialState;
+ this.profileURL = this.userData?.profileURL;
}
get initialState() {
diff --git a/app/styles/identity.module.css b/app/styles/identity.module.css
index 4ba9b3e6..dea58cbd 100644
--- a/app/styles/identity.module.css
+++ b/app/styles/identity.module.css
@@ -230,6 +230,30 @@
bottom: 8%;
}
+.identity-box-input {
+ border: 1px solid rgb(0 0 0 / 50%);
+ background: #fff;
+ width: 50%;
+ margin-top: 16px;
+ padding: 8px;
+ color: #0000af;
+ font-family: Inter, sans-serif;
+ font-size: 16px;
+ font-style: normal;
+ font-weight: 500;
+ line-height: normal;
+ border-radius: 8px;
+}
+
+.identity-box-input::placeholder {
+ color: #808080;
+ font-family: Inter, sans-serif;
+ font-size: 14px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+}
+
@media (width <= 460px) {
.identity-box-input {
width: 90%;
diff --git a/app/templates/identity.hbs b/app/templates/identity.hbs
index e451e1c9..23ebd9d4 100644
--- a/app/templates/identity.hbs
+++ b/app/templates/identity.hbs
@@ -16,6 +16,11 @@
{{else if (eq this.state 'step1')}}
+ {{else if (eq this.state 'step2')}}
+
{{/if}}