Skip to content

Commit 17159cb

Browse files
sf-sayeeduddin-syedsf-sayeeduddin-syed
authored
@W-18538344 Adding the assessement home page artefacts (#297)
1 parent 9899a50 commit 17159cb

File tree

3 files changed

+201
-0
lines changed

3 files changed

+201
-0
lines changed

‎src/components/AssessmentHomePage.ts‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import fs from 'fs';
2+
import path from 'path';
3+
4+
const data = {};
5+
6+
function generateModulesHTML(modules: typeof data.modules): string {
7+
return modules.map(mod => `
8+
<div class="dashboard-module-card">
9+
<div>
10+
<div class="dashboard-module-title">${mod.title}</div>
11+
<div class="dashboard-module-total">${mod.total}</div>
12+
<div class="dashboard-module-row">
13+
With Warning and Errors
14+
<span class="dashboard-module-warn">${mod.withWarningAndErrors.toString().padStart(2, '0')}</span>
15+
</div>
16+
<div class="dashboard-module-row">
17+
No Migration needed
18+
<span class="dashboard-module-neutral">${mod.noMigrationNeeded.toString().padStart(2, '0')}</span>
19+
</div>
20+
<div class="dashboard-module-row">
21+
With No Errors (Automated)
22+
<span class="dashboard-module-success">${mod.withNoErrors.toString().padStart(2, '0')}</span>
23+
</div>
24+
</div>
25+
<button class="dashboard-module-btn">View Assessment Report</button>
26+
</div>
27+
`).join('\n');
28+
}
29+
30+
export function generateAssessmentHomePageHTML(): string {
31+
const templatePath = path.join(__dirname, '../templates/AssessmentHomePage.template.html');
32+
let template = fs.readFileSync(templatePath, 'utf-8');
33+
34+
template = template
35+
.replace('{{orgName}}', data.orgInfo.name)
36+
.replace('{{orgId}}', data.orgInfo.orgId)
37+
.replace('{{packageName}}', data.orgInfo.packageName)
38+
.replace('{{dataModelType}}', data.orgInfo.dataModelType)
39+
.replace('{{assessmentDateTime}}', data.orgInfo.assessmentDateTime)
40+
.replace('{{modules}}', generateModulesHTML(data.modules));
41+
42+
return template;
43+
}

‎src/styles/AssessmentHomePage.css‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
.dashboard-root {
2+
background: #fafafa;
3+
min-height: 100vh;
4+
padding: 32px;
5+
}
6+
7+
.dashboard-warning {
8+
background: #fdebc8;
9+
padding: 12px;
10+
border-radius: 6px;
11+
margin: 16px 0;
12+
}
13+
14+
.dashboard-orginfo {
15+
display: flex;
16+
gap: 32px;
17+
background: #fff;
18+
padding: 24px;
19+
border-radius: 8px;
20+
margin-bottom: 32px;
21+
}
22+
23+
.dashboard-modules {
24+
display: flex;
25+
flex-wrap: wrap;
26+
gap: 24px;
27+
}
28+
29+
.dashboard-module-card {
30+
background: #fff;
31+
border-radius: 8px;
32+
box-shadow: 0 1px 4px rgba(0,0,0,0.04);
33+
flex: 1 1 320px;
34+
min-width: 320px;
35+
padding: 24px;
36+
display: flex;
37+
flex-direction: column;
38+
justify-content: space-between;
39+
}
40+
41+
.dashboard-module-title {
42+
font-weight: 600;
43+
font-size: 18px;
44+
}
45+
46+
.dashboard-module-total {
47+
font-size: 24px;
48+
font-weight: 700;
49+
margin-bottom: 16px;
50+
}
51+
52+
.dashboard-module-row {
53+
color: #888;
54+
margin-bottom: 8px;
55+
display: flex;
56+
justify-content: space-between;
57+
}
58+
59+
.dashboard-module-warn {
60+
color: #d32f2f;
61+
}
62+
63+
.dashboard-module-neutral {
64+
color: #888;
65+
}
66+
67+
.dashboard-module-success {
68+
color: #388e3c;
69+
}
70+
71+
.dashboard-module-btn {
72+
margin-top: 16px;
73+
padding: 8px 0;
74+
border: 1px solid #1976d2;
75+
border-radius: 4px;
76+
background: #fff;
77+
color: #1976d2;
78+
cursor: pointer;
79+
font-weight: 500;
80+
transition: background 0.2s, color 0.2s;
81+
}
82+
83+
.dashboard-module-btn:hover {
84+
background: #1976d2;
85+
color: #fff;
86+
}

‎src/templates/AssessmentHomePage.template.html‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Omnistudio Migration to Core Assessment Reports</title>
8+
</head>
9+
10+
<body>
11+
12+
<div className="dashboard-root">
13+
<h2>Omnistudio Migration to Core Assessment Reports</h2>
14+
<div className="dashboard-warning">
15+
<span>
16+
⚠️ Warning scoped notification message. <a href="#">Learn more</a>
17+
</span>
18+
</div>
19+
<div className="dashboard-orginfo">
20+
<div>
21+
<strong>Name</strong>
22+
<br />
23+
{data.orgInfo.name}
24+
</div>
25+
<div>
26+
<strong>Org ID</strong>
27+
<br />
28+
{data.orgInfo.orgId}
29+
</div>
30+
<div>
31+
<strong>Package Name</strong>
32+
<br />
33+
{data.orgInfo.packageName}
34+
</div>
35+
<div>
36+
<strong>Data Model Type</strong>
37+
<br />
38+
{data.orgInfo.dataModelType}
39+
</div>
40+
<div>
41+
<strong>Assessment Date and Time</strong>
42+
<br />
43+
{data.orgInfo.assessmentDateTime}
44+
</div>
45+
</div>
46+
<div className="dashboard-modules">
47+
{data.modules.map((mod: Module) => (
48+
<div key={mod.title} className="dashboard-module-card">
49+
<div>
50+
<div className="dashboard-module-title">{mod.title}</div>
51+
<div className="dashboard-module-total">{mod.total}</div>
52+
<div className="dashboard-module-row">
53+
With Warning and Errors
54+
<span className="dashboard-module-warn">{mod.withWarningAndErrors.toString().padStart(2, '0')}</span>
55+
</div>
56+
<div className="dashboard-module-row">
57+
No Migration needed
58+
<span className="dashboard-module-neutral">{mod.noMigrationNeeded.toString().padStart(2, '0')}</span>
59+
</div>
60+
<div className="dashboard-module-row">
61+
With No Errors (Automated)
62+
<span className="dashboard-module-success">{mod.withNoErrors.toString().padStart(2, '0')}</span>
63+
</div>
64+
</div>
65+
<button className="dashboard-module-btn">View Assessment Report</button>
66+
</div>
67+
))}
68+
</div>
69+
</div>
70+
</body>
71+
72+
</html>

0 commit comments

Comments
 (0)