User Story & User Acceptance Criteria

[TIPE 1 OWNER VIEW]

Feature	User Story	User Acceptance Criteria (UAC)
✅ Case Lihat Cover	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Cover Profile saya di bagian atas halaman profil, sehingga saya dapat mengenali akun saya dengan mudah dan memiliki opsi untuk mengganti cover jika diinginkan.	Given user sudah login,When user membuka halaman User Profile (tab manapun) atau detail profil,Then sistem menampilkan Cover Profile di bagian paling atas halaman.
Given user belum pernah mengganti cover,When halaman profil dimuat,Then sistem menampilkan default cover image.
Given user sudah pernah mengganti cover,When halaman profil dimuat,Then sistem menampilkan cover image milik user.
Given halaman profil menampilkan Cover Profile,When cover dimuat,Then sistem menampilkan icon Pensil/Edit di pojok kanan atas cover.
Given user mengklik icon Pensil/Edit di cover,When user melakukan aksi klik,Then sistem menampilkan modal Ubah Cover Image.
✅ Case Ubah Cover	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus Cover Profile saya melalui modal, sehingga saya bisa menyesuaikan tampilan profil saya sesuai preferensi.	Given user sudah login dan berada di halaman profil, When user klik icon Pensil / tombol Ubah di pojok kanan atas cover, Then sistem menampilkan Modal Ubah Cover Image yang berisi:
Given cover saat ini adalah default,When user melihat tombol Hapus Cover,Then tombol berada dalam keadaan disabled dan tidak bisa diklik.
Given cover saat ini adalah custom, When user klik tombol Hapus Cover, Then sistem menampilkan pop-up konfirmasi dengan pesan: “Hapus Cover? Jika cover image dihapus, sistem secara otomatis akan menggunakan cover image standar.”
Given user klik Batalkan pada pop-up,When aksi dikonfirmasi,Then pop-up tertutup dan user kembali ke modal tanpa perubahan.
Given user klik Hapus pada pop-up, When aksi dikonfirmasi, Then sistem:
Given user klik tombol X (Close) pada modal,When aksi diklik,Then modal tertutup dan perubahan dibatalkan, cover tidak berubah.
Given user klik tombol Ganti Cover,When tombol diklik,Then sistem membuka File Manager (desktop/mobile) dengan filter file .jpg, .jpeg, .png.
Given user memilih file gambar dari perangkat, When file berhasil diunggah, Then sistem menampilkan preview cover baru di modal dengan fitur:
Given user klik tombol X (Close) setelah memilih cover baru,When aksi diklik,Then modal tertutup dan perubahan dibatalkan, cover tidak berubah.
Given user klik tombol Simpan Perubahan setelah memilih cover baru,When aksi diklik,Then sistem menyimpan cover baru, menampilkan notifikasi “Cover berhasil diperbarui,” dan cover di halaman profil langsung diperbarui.
✅ Case: Lihat Foto Profil	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Foto Profil saya di halaman profil, sehingga saya dapat mengenali akun saya dengan mudah dan memiliki opsi untuk menambahkan atau mengganti foto profil jika diperlukan.	Given user sudah login,When user membuka halaman User Profile atau Detail Profil,Then sistem menampilkan Foto Profil user di area atas halaman.
Given user belum pernah mengunggah foto profil,When halaman profil dimuat,Then sistem menampilkan avatar default.
Given user sudah pernah mengunggah foto profil,When halaman profil dimuat,Then sistem menampilkan foto profil milik user
Given halaman profil menampilkan Foto Profil,When foto profil dimuat,Then sistem menampilkan ikon Pensil/Edit di pojok kanan bawah foto.
Given user mengklik ikon Pensil/Edit, When aksi diklik, Then sistem menampilkan modal sesuai kondisi: Jika sebelumnya belum ada foto Jika sudah ada foto
✅ Case Tambah Foto Profil	Sebagai seorang pengguna platform yang sudah login dan belum memiliki foto profil, saya ingin dapat menambahkan foto profil baru melalui modal, sehingga foto saya dapat ditampilkan di rapor, laporan belajar, sertifikat, dan halaman profil.	Given user sudah login dan foto profil saat ini masih avatar default, When user klik ikon Ubah Foto Profil pada halaman profil, Then sistem menampilkan Modal Tambahkan Foto Profil yang berisi:
Given user klik tombol Tambah Foto Profil, When tombol diklik, Then sistem membuka File Manager (desktop/mobile) dengan filter file:
Given user memilih file gambar dari perangkat, When file berhasil dipilih, Then sistem menampilkan Modal Atur Foto Profil dengan komponen:
Given user telah mengatur foto profil sesuai keinginan, When user klik tombol Simpan, Then sistem:
✅ Case Ubah / Hapus Foto Profil	Sebagai seorang pengguna platform yang sudah login dan memiliki foto profil custom, saya ingin dapat mengganti atau menghapus foto profil saya melalui modal, sehingga saya bisa memperbarui tampilan akun sesuai preferensi atau kembali ke avatar default.	Given user sudah login dan foto profil saat ini adalah custom, When user klik icon Ubah Foto Profil pada halaman profil, Then sistem menampilkan Modal Ubah Foto Profil dengan:
Given user klik tombol Ubah Foto Profil,When tombol diklik,Then sistem membuka File Manager (desktop/mobile) dengan filter file: .jpg, .jpeg, .png.
Given user memilih file gambar baru dari perangkat, When file berhasil dipilih, Then sistem menampilkan Modal Atur Foto Profil dengan:
Given user sudah menyesuaikan foto,When user klik tombol Simpan,Then sistem menyimpan perubahan, menutup modal, menampilkan notifikasi “Foto profil berhasil diperbarui,” dan memperbarui foto profil di halaman profil secara langsung.
Given user klik tombol Hapus Foto Profil, When tombol diklik, Then sistem menampilkan Modal Konfirmasi Hapus Foto Profil dengan:
Given user klik Batalkan,When aksi dikonfirmasi,Then modal tertutup, dan foto profil tetap sama.
Given user klik Hapus Foto Profil,When aksi dikonfirmasi,Then sistem mengganti foto profil menjadi avatar default, menutup modal, dan menampilkan notifikasi “Foto profil berhasil dihapus.”
✅ Case: Lihat Status Privasi Akun	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat status privasi akun saya di halaman profil, sehingga saya dapat mengetahui apakah akun saya bersifat Privat atau Publik dan diarahkan ke pengaturan privasi jika ingin mengubahnya.	Given user sudah login,When user membuka halaman User Profile atau Detail Profil,Then sistem menampilkan ikon gembok di sebelah kanan Nama Lengkap user.
Given ikon gembok dalam kondisi terkunci (lock),When halaman profil dimuat,Then status akun user adalah Privat.
Given ikon gembok dalam kondisi terbuka (unlock),When halaman profil dimuat,Then status akun user adalah Publik.
Given user belum mengubah pengaturan privasi,When halaman profil dimuat pertama kali,Then status privasi akun diset sebagai Privat (ikon terkunci).
Given user mengklik ikon gembok,When aksi diklik,Then sistem membuka halaman Pengaturan Akun (di tab baru) spesifik pada tab pengaturan privasi profil.
✅ Case: Lihat Profil Side Bar	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Profil Sidebar di halaman User Profile, sehingga saya dapat melihat ringkasan informasi akun user dengan jelas dan dapat mengakses detail lebih lanjut atau berbagi profil dengan mudah.	Given user sudah login, When user membuka halaman User Profile (tab manapun), Then sistem menampilkan Profil Sidebar di sisi kiri halaman dengan: Foto Profil:
Given akun user memiliki status verifikasi, When user menghover icon status verifikasi, Then sistem menampilkan informasi verifikasi akun.
Given sidebar menampilkan icon Privacy (gembok), When diklik, Then user diarahkan ke halaman pengaturan akun spesifik tab privasi profil.
Given data tersedia, Then sidebar menampilkan: Nomor Ponsel: Alamat Lengkap:
Given sidebar menampilkan tombol “Informasi Pribadi”,When user klik tombol,Then sistem redirect ke halaman detail profil user.
Given When Then sistem menampilkan modal bagikan dengan opsi:
✅ Case: Bagikan Profil	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat membagikan profil saya melalui tombol Bagikan, sehingga saya bisa membagikan portofolio dan informasi profil ke teman atau media sosial dengan mudah.	Given user sudah login,When user membuka halaman User Profile (di tab manapun),Then sistem menampilkan tombol Bagikan di profil header.
Given When Then sistem menampilkan opsi berbagi:
Given Copy Link (both from page overview and portofolio) When Then "Yuk, lihat portofolio belajarku di [nama platform]: [url profil user]"Í Given Then "Link profil berhasil disalin"
Given (both from page overview and portofolio) When Then "Yuk, lihat portofolio belajarku di [nama platform]: [url profil user]"
Given user klik tombol Bagikan sementara status privasi akun masih Privat,When aksi diklik,Then sistem menampilkan pop-up dengan informasi bahwa akun privat dan CTA mengarahkan user ke halaman pengaturan akun spesifik tab privasi profil.
✅ Case: Lihat Data Personal	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat data personal saya di tab Detail Profil, sehingga saya dapat mengetahui informasi akun saya secara lengkap dan dapat mengeditnya jika diperlukan.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan informasi berikut: Nama Lengkap Jenis Kelamin Tanggal Lahir Email → menampilkan alamat email user beserta badge status verifikasi (Verified / Unverified) Nomor Ponsel Deskripsi Diri
Given When Then Edit (Pensil) Edit Data Personal
✅ Case: Ubah Data Personal	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah data personal saya melalui modal, sehingga informasi akun saya tetap akurat dan up-to-date.	Given user sudah login dan berada di tab Detail Profil, When user klik ikon Edit (Pensil) pada section Data Personal, Then sistem menampilkan modal Edit Data Personal yang berisi field: Jenis Kelamin Tanggal Lahir Nomor Ponsel Deskripsi Diri Simpan Batalkan / Close
Given When Simpan Then sistem melakukan validasi data. "Perubahan berhasil disimpan"
Given user berada di modal Edit Data Personal,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan, section Data Personal tetap menampilkan data sebelumnya.
✅ Case: Lihat Identitas Resmi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat identitas resmi saya di tab Detail Profil dengan proteksi data sensitif, sehingga saya bisa memastikan data saya tercatat dengan benar tanpa risiko kebocoran informasi.	Given When Detail Profil Then Kewarganegaraan Jenis Dokumen Nomor Identitas Given Then '-'
Given nomor identitas ditampilkan dengan masking, Then masking berlaku tidak hanya pada tampilan halaman tetapi juga saat inspect code.
Given user melihat identitas resmi, Then sistem menampilkan: Icon Visibility (Mata) Icon Edit (Pensil) Edit Identitas Resmi
✅ Case: Ubah Identitas Resmi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah data identitas resmi saya melalui modal, sehingga informasi resmi saya selalu akurat dan tersinkronisasi dengan sistem administrasi.	Given user sudah login dan berada di tab Detail Profil, When user klik icon Edit (Pensil) pada section Identitas Resmi, Then sistem menampilkan modal Edit Identitas Resmi dengan field: Kewarganegaraan Jenis Dokumen Nomor Induk Kependudukan / Visa / Paspor / KITAS / KITAP Simpan Batalkan / Close
Given user telah mengisi field dengan benar, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Kelola Pengguna
Given user berada di modal Edit Identitas Resmi,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan
✅ Case: Lihat Alamat Domisili	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat alamat domisili saya secara lengkap di halaman profil, sehingga saya bisa memastikan data alamat tercatat dengan benar dan dapat mengeditnya jika diperlukan.	Given user sudah login, When user membuka section Identitas Resmi, Then sistem menampilkan alamat domisili user secara lengkap.
Given alamat lengkap tersedia, Then sistem menampilkan link Google Maps,
Given user melihat alamat domisili,Then sistem menampilkan icon Edit (Pensil) untuk membuka modal Edit Alamat Domisil
✅ Case: Ubah Alamat Domisili	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah alamat domisili saya melalui modal, sehingga data alamat saya selalu akurat dan tersinkronisasi dengan sistem administrasi.	Given user sudah login dan berada di section Identitas Resmi, When user klik icon Edit (Pensil) pada Alamat Domisili, Then sistem menampilkan modal Edit Alamat Domisili dengan field: Negara Provinsi Kota/Kabupaten Kecamatan Kelurahan Kode Pos Alamat Lengkap URL Google Maps Simpan Batalkan / Close
Given user sudah mengisi alamat, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Kelola Pengguna
Given user berada di modal Edit Alamat Domisili,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan, section Alamat Domisili tetap menampilkan data sebelumnya.
✅ Case: Lihat Pendidikan	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat riwayat pendidikan formal saya di tab Detail Profil, sehingga saya bisa memeriksa dan memastikan data pendidikan tercatat dengan lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar riwayat pendidikan formal user dengan informasi: Nama Institusi Lokasi Periode Studi Jenjang Pendidikan & Jurusan Indeks Prestasi Kumulatif (IPK)
Given user belum memiliki data pendidikan,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pendidikan”).
Given tab Pendidikan terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Pendidikan	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan data pendidikan formal saya, sehingga riwayat pendidikan saya tercatat dengan lengkap dan akurat.	Given user sudah login dan berada di section Pendidikan, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Pendidikan dengan field: Nama Institusi Lokasi Jenjang Pendidikan Jurusan / Program Studi Periode Masuk & Lulus Checkbox Masih Belajar IPK Checkbox Belum Memiliki IPK Simpan Batalkan / Close
Given When Simpan Then sistem melakukan validasi: Pendidikan Terakhir "Pendidikan berhasil ditambahkan"
Given user berada di modal Tambah Pendidikan,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan
✅ Case: Ubah/Hapus Pendidikan	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data pendidikan formal yang sudah tercatat, sehingga riwayat pendidikan saya selalu akurat dan up-to-date.	Given user sudah login dan memiliki data pendidikan, When user klik tombol Ubah di section Pendidikan Terakhir, Then sistem menampilkan modal daftar pendidikan yang sudah ada, dengan opsi untuk setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik Simpan, Then sistem melakukan validasi field:
Given validasi berhasil, Then sistem: "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan.
Given user mengkonfirmasi penghapusan, Then sistem: "Data berhasil dihapus"
Given Then
✅ Case: Lihat Lama Pengalaman Kerja	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat lama pengalaman kerja saya di tab Detail Profil, sehingga saya dapat memeriksa dan memastikan data pengalaman kerja tercatat dengan lengkap.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan informasi lama pengalaman kerja user
Given user belum memiliki data pengalaman kerja,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pengalaman kerja”).
Given tab pengalaman kerja terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Lihat Pengalaman Kerja	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar pengalaman kerja saya di tab Detail Profil, sehingga saya bisa memeriksa dan memastikan semua riwayat pekerjaan tercatat dengan lengkap dan akurat.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar pengalaman kerja user dengan informasi setiap item: Nama Posisi / Jabatan Periode Kerja Nama Perusahaan Industri Jenis Perjanjian Kerja Deskripsi Pekerjaan
Given user belum memiliki data pengalaman kerja,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pengalaman kerja”)
Given tab pengalaman kerja terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Pengalaman Kerja	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan data pengalaman kerja saya melalui modal, sehingga riwayat pekerjaan saya tercatat lengkap dan akurat.	Given user sudah login dan berada di section Pengalaman Kerja, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Pengalaman Kerja dengan field: Nama Posisi / Jabatan Nama Perusahaan Industri Jenis Perjanjian Kerja Periode Mulai & Akhir Checkbox 'Masih Bekerja Hingga Saat Ini' Deskripsi Pekerjaan Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pengalaman Kerja "Pengalaman kerja berhasil ditambahkan"
Given user berada di modal Tambah Pengalaman Kerja,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Pengalaman Kerja	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data pengalaman kerja yang sudah tercatat, sehingga riwayat pekerjaan saya selalu akurat dan up-to-date.	Given user sudah login dan memiliki data pengalaman kerja, When user klik tombol Ubah di section Pengalaman Kerja, Then sistem menampilkan modal daftar pengalaman kerja dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pengalaman Kerja "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Pengalaman Kerja "Data berhasil dihapus"
Given user membatalkan konfirmasi,Then modal tertutup dan data tetap tersimpan tanpa perubahan
✅ Case: Lihat Pengalaman Organisasi	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar pengalaman organisasi saya di tab Detail Profil, sehingga saya bisa memeriksa dan memastikan semua riwayat organisasi tercatat dengan lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar pengalaman organisasi user dengan informasi setiap item: Nama Jabatan / Posisi Periode Keanggotaan Nama Organisasi Deskripsi Tambahan
Given user belum memiliki data pengalaman organisasi,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pengalaman organisasi”).
Given tab pengalaman organisasi terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Pengalaman Organisasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan data pengalaman organisasi saya melalui modal, sehingga riwayat organisasi saya tercatat lengkap dan akurat.	Given user sudah login dan berada di section Pengalaman Organisasi, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Pengalaman Organisasi dengan field: Nama Jabatan / Posisi Nama Organisasi Periode Mulai & Akhir Checkbox 'Masih Aktif Hingga Saat Ini' Simpan Batalkan / Clos
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pengalaman Organisasi "Pengalaman organisasi berhasil ditambahkan"
Given user berada di modal Tambah Pengalaman Organisasi,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya
✅ Case: Ubah/Hapus Pengalaman Organisasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data pengalaman organisasi yang sudah tercatat, sehingga riwayat organisasi saya selalu akurat dan up-to-date.	Given When Ubah Then sistem menampilkan modal daftar pengalaman organisasi dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pengalaman Organisasi "Perubahan berhasil disimpa
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusa
Given user mengkonfirmasi penghapusan, Then sistem: Pengalaman Organisasi "Data berhasil dihapus"
Given user membatalkan konfirmasi,Then modal tertutup dan data tetap tersimpan tanpa perubahan
✅ Case: Lihat Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar prestasi yang pernah saya raih di tab Detail Profil, sehingga saya bisa memantau dan menampilkan pencapaian saya secara lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar prestasi user dengan informasi setiap item: Nama Penghargaan / Prestasi Nama Lembaga / Ajang Penyelenggara Tahun Penerimaan
Given user belum memiliki data prestasi,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data prestasi”).
Given tab prestasi terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan prestasi yang pernah saya raih melalui modal, sehingga daftar pencapaian saya tercatat lengkap dan akurat.	Given user sudah login dan berada di section Prestasi, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Prestasi dengan field: Nama Prestasi / Penghargaan Nama Penyelenggara / Lembaga Tahun Penerimaan Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Prestasi "Prestasi berhasil ditambahkan"
Given user berada di modal Tambah Prestasi,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data prestasi yang sudah tercatat, sehingga daftar pencapaian saya selalu akurat dan up-to-date.	Given user sudah login dan memiliki data prestasi, When user klik tombol Ubah di section Prestasi, Then sistem menampilkan modal daftar prestasi dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Prestasi "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Prestasi "Data berhasil dihapus"
Given Then
✅ Case: Lihat Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar pelatihan dan sertifikasi yang pernah saya ikuti di tab Detail Profil, sehingga saya bisa memantau dan menampilkan riwayat pengembangan profesional saya secara lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar pelatihan & sertifikasi user dengan informasi setiap item: Nama Pelatihan / Sertifikasi Periode Pelatihan Nama Penyelenggara Tipe Pelaksanaan Lokasi Pelatihan Deskripsi Ringkas URL Credential
Given user belum memiliki data pelatihan & sertifikasi,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pelatihan & sertifikasi”).
Given tab pelatihan & sertifikasi terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan data pelatihan dan sertifikasi melalui modal, sehingga riwayat pengembangan profesional saya tercatat lengkap dan dapat ditampilkan di profil maupun tab sertifikat.	Given user sudah login dan berada di section Pelatihan & Sertifikasi, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Pelatihan & Sertifikasi dengan field: Nama Pelatihan / Sertifikasi Nama Penyelenggara Periode Mulai & Akhir Tipe Pelaksanaan Lokasi Deskripsi URL Credential Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Pelatihan & Sertifikasi "Pelatihan/sertifikasi berhasil ditambahkan" Sertifikat
Given user berada di modal Tambah Pelatihan & Sertifikasi,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data pelatihan dan sertifikasi yang sudah tercatat, sehingga riwayat pengembangan profesional saya selalu akurat dan up-to-date di profil maupun tab sertifikat.	Given user sudah login dan memiliki data pelatihan/sertifikasi, When user klik tombol Ubah di section Pelatihan & Sertifikasi, Then sistem menampilkan modal daftar pelatihan/sertifikasi dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pelatihan & Sertifikasi "Perubahan berhasil disimpan" Sertifikat
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Pelatihan & Sertifikasi "Data berhasil dihapus" Sertifikat
Given Then
✅ Case: Lihat Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat daftar bahasa yang saya kuasai di tab Detail Profil, sehingga saya bisa menampilkan kemampuan bahasa saya secara lengkap dan mudah diakses.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar bahasa yang dikuasai user dengan informasi setiap item: Nama Bahasa Tingkat Kemahiran
Given user belum memiliki data bahasa,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data bahasa”).
Given tab bahasa terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan bahasa yang saya kuasai beserta tingkat kemahirannya, sehingga daftar kemampuan bahasa saya tercatat lengkap dan dapat ditampilkan di profil.	Given user sudah login dan berada di section Bahasa, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Bahasa dengan field: Nama Bahasa Tingkat Kemahiran Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Bahasa "Bahasa berhasil ditambahkan"
Given user berada di modal Tambah Bahasa,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data bahasa yang saya kuasai, sehingga daftar kemampuan bahasa saya selalu akurat dan up-to-date di profil.	Given user sudah login dan memiliki data bahasa, When user klik tombol Ubah di section Bahasa, Then sistem menampilkan modal daftar bahasa dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Bahasa "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Bahasa "Data berhasil dihapus"
Given Then
✅ Case: Lihat Keahlian	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat daftar keahlian saya dalam bentuk tag di tab Detail Profil, sehingga saya bisa menampilkan kemampuan profesional saya secara ringkas dan mudah dibaca.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan daftar keahlian dalam bentuk tag/chip dengan urutan sesuai input user (tidak ada sorting otomatis).
Given user belum memiliki data keahlian,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada keahlian yang ditambahkan”) dan tombol Tambah muncul
Given user sudah memiliki minimal 1 keahlian,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengakses modal edit keahlian.
Given user berada di section Keahlian,Then sistem menampilkan tombol Tambah / Ubah sesuai kondisi data keahlian.
When user klik tombol tersebut,Then sistem membuka modal untuk menambah atau mengubah keahlian (detail modal bisa dibuat di case Tambah/Ubah Keahlian berikutnya).
✅ Case: Ubah Keahlian	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus keahlian yang saya kuasai, sehingga daftar keahlian saya selalu akurat dan up-to-date di profil.	Given user sudah login dan memiliki data keahlian, When user klik tombol Ubah di section Keahlian, Then sistem menampilkan modal Edit Keahlian dengan fitur: tag input menambah tag baru menghapus tag mengubah tag 10 keahlian Simpan Batalkan / Close
Given user telah mengubah keahlian sesuai kebutuhan, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Keahlian "Keahlian berhasil diperbarui
Given user berada di modal Edit Keahlian,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Lihat Bidang Pekerjaan Diminati	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat bidang pekerjaan yang saya minati dalam bentuk tag di tab Detail Profil, sehingga saya bisa menampilkan preferensi karier saya secara ringkas dan mudah dibaca.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan daftar bidang pekerjaan yang diminati user dalam bentuk tag/chip, sesuai urutan input user (tidak ada sorting otomatis).
Given user belum memiliki data bidang pekerjaan diminati,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada bidang pekerjaan diminati yang ditambahkan”) dan tombol Tambah (+) muncul.
Given user sudah memiliki minimal 1 bidang pekerjaan diminati,Then sistem menampilkan icon Ubah (pensil) pada section tersebut untuk mengakses modal edit.
Given user berada di section Bidang Pekerjaan Diminati,Then sistem menampilkan tombol Tambah (+) jika kosong, atau tombol Ubah (pensil) jika sudah ada data.
When user klik tombol tersebut,Then sistem membuka modal untuk menambah atau mengubah bidang pekerjaan diminati (detail modal bisa dibuat di case Tambah/Ubah berikutnya).
✅ Case: Ubah Bidang Pekerjaan Diminati	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus bidang pekerjaan yang saya minati, sehingga daftar preferensi karier saya selalu akurat dan up-to-date di profil.	Given user sudah login dan memiliki minimal 1 bidang pekerjaan diminati, When user klik tombol Ubah (pensil) di section Bidang Pekerjaan Diminati, Then sistem menampilkan modal Edit Bidang Pekerjaan Diminati dengan fitur: tag input menambah tag baru menghapus tag mengubah tag Simpan Batalkan / Close
Given user telah mengubah bidang pekerjaan diminati sesuai kebutuhan,When user klik tombol Simpan,Then sistem melakukan validasi (misal tidak ada tag kosong)
Given validasi berhasil, Then sistem: Bidang Pekerjaan Diminati "Bidang pekerjaan berhasil diperbarui"
Given user berada di modal Edit Bidang Pekerjaan Diminati,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Lihat CV	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat file CV saya di tab Detail Profil, sehingga saya bisa mengakses atau membagikan CV dengan mudah.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan file CV user jika sudah diunggah (contoh: `cv_johndoe.pdf`) dengan link untuk mengunduh.
Given user belum mengunggah CV,Then sistem menampilkan tombol Tambah.
Given user sudah mengunggah CV sebelumnya,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengganti file CV.
Given file CV tersedia,When user klik link file CV,Then file akan diunduh ke perangkat user.
✅ Case: Tambah/Ubah CV	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengunggah atau mengganti file CV saya, sehingga CV saya selalu up-to-date dan dapat diakses langsung di profil.	Given user sudah login, When user klik tombol Tambah / Ubah di section CV, Then sistem menampilkan modal Upload CV dengan fitur: upload file Hapus File Simpan Batalkan / Close
Given user memilih file CV baru dan klik tombol Simpan, Then sistem melakukan validasi: PDF
Given Then sistem: CV "CV berhasil diperbarui"
Given user klik tombol Hapus File di modal upload CV,Then sistem menampilkan konfirmasi penghapusan.
Given user konfirmasi,Then sistem menghapus file CV lama, section CV menampilkan state kosong, dan tombol Tambah muncul kembali.
Given user klik Batalkan / Close,Then modal tertutup tanpa perubahan, file CV tetap tersimpan.
✅ Case: Lihat Portofolio	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat URL portofolio saya di tab Detail Profil, sehingga saya bisa mengakses portofolio atau membagikannya dengan mudah.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan URL portofolio user jika sudah diunggah, dengan link yang dapat diklik dan terbuka di tab baru.
Given user belum menambahkan portofolio,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada portofolio yang ditambahkan”) dan tombol Tambah muncul.
Given user sudah menambahkan portofolio sebelumnya,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengganti atau memperbarui link portofolio.
Given When Then
✅ Case: Tambah/Ubah Portofolio	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus URL portofolio saya, sehingga informasi portofolio yang tampil di profil selalu akurat dan dapat diakses dengan mudah.	Given user sudah login, When user klik tombol Tambah / Ubah di section Situs Portofolio, Then sistem menampilkan modal Edit Portofolio dengan fitur: URL situs Simpan Batalkan / Close Hapus link
Given user mengisi atau mengubah URL portofolio dan klik tombol Simpan,Then sistem melakukan validasi format URL.
Given validasi berhasil, Then sistem: Situs Portofolio "Portofolio berhasil diperbarui"
Given user klik tombol Hapus link di modal edit portofolio,Then sistem menampilkan konfirmasi penghapusan.
Given user konfirmasi,Then sistem menghapus link portofolio, section menampilkan empty state, dan tombol Tambah muncul kembali
Given Batalkan / Close Then
✅ Case: Lihat Media Sosial	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat URL media sosial saya di tab Detail Profil, sehingga saya bisa mengakses atau membagikan akun media sosial dengan mudah.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan URL media sosial user jika sudah diunggah, dengan link yang dapat diklik dan terbuka di tab baru
Given user belum menambahkan media sosial,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada media sosial yang ditambahkan”) dan tombol Tambah muncul.
Given user sudah menambahkan media sosial sebelumnya,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengganti atau memperbarui link media sosial.
Given link media sosial tersedia,When user klik link media sosial,Then link akan terbuka di tab baru browser sesuai URL yang diberikan.
✅ Case: Tambah/Ubah Media Sosial	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus link media sosial saya, sehingga informasi media sosial yang tampil di profil selalu akurat dan dapat diakses dengan mudah.	Given user sudah login, When user klik tombol Tambah / Ubah di section Media Sosial, Then sistem menampilkan modal Edit Media Sosial dengan fitur: Jenis Media Sosial URL situs Simpan Batalkan / Close Hapus link
Given user mengisi atau mengubah URL media sosial dan klik tombol Simpan,Then sistem melakukan validasi format URL.
Given Then sistem: Media Sosial "Media Sosial berhasil diperbarui"
Given user klik tombol Hapus link di modal edit media sosial,Then sistem menampilkan konfirmasi penghapusan.
Given user konfirmasi,Then sistem menghapus link media sosial, section menampilkan empty state, dan tombol Tambah muncul kembali.
Given user klik Batalkan / Close,Then modal tertutup tanpa perubahan, link media sosial tetap tersimpa
❌ Negative Case	Sebagai seorang pengguna platform, saya ingin melihat indikasi yang jelas ketika data profil tidak tersedia atau gagal dimuat, sehingga saya tahu bahwa data kosong atau terjadi kesalahan, dan dapat mengambil tindakan yang sesuai.	Given user membuka tab Detail Profil,When salah satu section (misal: Pendidikan, Pengalaman Kerja, Keahlian, Media Sosial, dll) tidak memiliki data,Then sistem menampilkan empty state di section tersebut dengan pesan informatif (contoh: “Belum ada data yang ditambahkan”)
Then tombol Tambah muncul untuk memungkinkan user menambahkan data baru.
Given user membuka tab Detail Profil, When sistem gagal memuat data dari server atau terjadi error jaringan, Then sistem menampilkan Error State di seluruh halaman dengan: "Terjadi kesalahan saat memuat data." Muat Ulang Overview
Given user klik tombol Muat Ulang,Then sistem memulai ulang proses loading data.
Given data berhasil dimuat setelah refresh,Then error state hilang, dan seluruh section menampilkan data sesuai ketersediaan
✅ Case: Lihat Overview	Sebagai pengguna platform yang sudah login, saya ingin melihat tab Overview di halaman profil saya, sehingga saya bisa mendapatkan ringkasan cepat dari portofolio, sertifikat, hasil belajar, hasil asesmen, dan aktivitas saya.	Given user sudah login, When user membuka tab Overview pada halaman User Profile, Then sistem menampilkan section utama secara berurutan: Then setiap section menampilkan maksimal 2 card terbaru dari data yang ada di tab asalnya. Then setiap card menampilkan informasi dan bentuk tampilan yang sama persis dengan tab asal.
Given user melihat card pada Overview,When user klik salah satu card,Then sistem mengarahkan user ke halaman detail card tersebut (tab asal).
Given setiap section menampilkan ikon gembok (privacy),When user klik ikon gembok,Then sistem mengarahkan user ke halaman pengaturan akun privasi profil spesifik pada section tersebut (open new tab)
Given user berada pada header section,When user klik ikon gembok,Then sistem menampilkan Modal Ubah Privasi Section untuk section tersebut.
Given user melihat header section,When user klik tombol “Lihat Semua”,Then sistem mengarahkan user ke tab asal section (misal: Portofolio → Tab Portofolio).
Given suatu section tidak memiliki data,Then sistem menampilkan empty state di section tersebut dengan pesan yang sesuai (contoh: “Belum ada data di section ini”).
✅ Case: Lihat Portofolio	Sebagai pengguna platform yang sudah login, saya ingin membuka tab Portfolio untuk melihat seluruh portofolio saya, baik yang diunggah otomatis melalui aktivitas maupun manual, sehingga saya dapat meninjau dan mengelola karya saya dengan mudah.	Given user login dan memiliki minimal satu portofolio (otomatis atau manual), When user klik tab Portfolio, Then sistem menampilkan daftar portofolio user yang terdiri dari: Portofolio Otomatis Portofolio Manual Then setiap card portofolio menampilkan: Background portofolio Tag Tahun Ajaran (TA) Nama portofolio Tagging “Platform” atau “Lainnya”: Tagging status privasi “Publik” atau “Privat”:
Given When Then halaman detail portofolio Then button Pin
Then terbaru → terlama (newest → oldest) Then 10 card portofolio Then pagination
✅ Case: Cari Portofolio	Sebagai pengguna platform, saya ingin mencari portofolio berdasarkan nama melalui kolom pencarian, sehingga saya dapat menemukan portofolio tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar portofolio, Then sistem menampilkan search bar dengan:
Given user mengetik nama portofolio pada kolom pencarian,When user memasukkan minimal 1 karakter pada search bar (tanpa klik enter atau icon search) Then sistem memproses pencarian berdasarkan case-insensitive partial match. Then selama proses pencarian: loading indicator
Then setelah hasil diterima: ascending berdasarkan nama relevansi kecocokan Then jika user menghapus teks pencarian → tampilkan kembali daftar portofolio default (seluruh portofolio terbaru).
✅ Case: Filter Portofolio	Sebagai pengguna platform, saya ingin memfilter portofolio berdasarkan akses profil, sumber, dan tahun ajaran, sehingga saya dapat menampilkan portofolio yang relevan sesuai kriteria yang saya inginkan.	Given user berada di halaman Portofolio, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Portofolio dengan opsi: Akses Profil: Sumber: Tahun Ajaran: Close (X) Reset Terapkan Filter
Given user mengklik tombol Close (X) pada modal filter,Then modal tertutup dan tidak ada perubahan pada daftar portofolio di halaman utama.
Given user mengklik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal/default
Given user memilih satu atau beberapa opsi filter,When user mengklik tombol Terapkan Filter,Then modal tertutup dan daftar portofolio di halaman utama diperbarui sesuai kriteria filter yang dipilih.Then hasil filter diterapkan secara real-time pada tampilan list portofolio.
✅ Case: Pin Portofolio	Sebagai pengguna, saya ingin dapat mem-pin portofolio favorit saya sehingga card tersebut selalu muncul di posisi paling atas daftar portofolio untuk memudahkan akses cepat.	Given user sudah login dan membuka tab Portofolio,When user melihat daftar card portofolio,Then setiap card menampilkan icon Pin di card header
Given card belum dipin (icon Pin abu-abu),When user mengklik icon Pin,Then status card menjadi pinned (icon Pin berubah biru) dan card berpindah ke posisi paling atas kiri daftar portofolio.
Given card sudah dipin (icon Pin biru),When user mengklik icon Pin kembali,Then status pinned dilepaskan (icon Pin kembali abu-abu) dan card kembali ke posisi normal berdasarkan urutan waktu (newest → oldest).
✅ Case: Navigasi Pagination	Sebagai pengguna, saya ingin dapat berpindah antar halaman portofolio sehingga saya bisa melihat seluruh daftar portofolio meskipun jumlahnya lebih dari satu halaman.	Given user membuka tab Portofolio dan memiliki lebih dari 10 portofolio,Then sistem menampilkan tombol pagination di bagian bawah daftar portofolio dengan label halaman (1, 2, 3, …).
Given user memiliki ≤ 10 portofolio,Then pagination tidak ditampilkan.
Given user klik tombol pagination (misal: Halaman 2),Then sistem menampilkan maksimal 10 card portofolio sesuai halaman yang dipilih. Urutan portofolio tetap newest → oldest secara global, tidak berubah berdasarkan halaman.
✅ Case: Lihat Detail Portofolio (Otomatis)	Sebagai pengguna, saya ingin melihat halaman detail portofolio sehingga saya dapat melihat informasi lengkap portofolio yang saya unggah atau yang dihasilkan dari aktivitas/program.	Given user sudah login, memiliki minimal satu portofolio, dan berada di tab Portfolio,When user klik salah satu card portofolio,Then sistem menampilkan halaman detail portofolio yang dipilih.
✅ Case: Lihat Detail Portofolio (Manual)	Sebagai pengguna, saya ingin melihat halaman detail portofolio yang saya unggah secara manual sehingga saya dapat meninjau informasi lengkap dan konten portofolio saya.	Given user sudah login, memiliki minimal satu portofolio manual, dan berada di tab Portfolio,When user klik salah satu card portofolio,Then sistem menampilkan halaman detail portofolio yang dipilih.
✅ Case: Tambah Portofolio (Manual)	Sebagai pengguna, saya ingin menambahkan portofolio baru secara manual melalui halaman Portfolio, agar saya dapat menyimpan dan menampilkan hasil karya atau dokumen saya secara lengkap.	Given user sudah login dan berada di tab Portfolio, When user klik tombol Tambah Portofolio, Then sistem menampilkan modal Tambah Portofolio dengan field:
When Simpan Perubahan Then Jika valid: “Portofolio berhasil ditambahkan.” Card portofolio menampilkan preview konten dalam bentuk grid card berdasarkan jenis file, meliputi:
When user klik tombol Batalkan,Then modal ditutup tanpa menyimpan perubahan apa pun.
✅ Case: Ubah Portofolio (Otomatis)	Sebagai pengguna, saya ingin dapat memperbarui refleksi pada portofolio otomatis yang dihasilkan dari aktivitas platform, agar saya bisa menambahkan catatan pribadi atau insight terkait portofolio tersebut tanpa mengubah data portofolio lainnya.	Given user sudah login dan berada di halaman detail portofolio otomatis,When user klik tombol/ikon Edit/Ubah,Then sistem menampilkan form Ubah Portofolio Otomatis.
When Simpan Then Refleksi “Refleksi berhasil diperbarui.” Detail Portofolio
When user klik tombol Batalkan,Then sistem membatalkan proses edit dan mengembalikan user ke halaman detail portofolio tanpa menyimpan perubahan apa pun.
✅ Case: Ubah Portofolio (Manual)	Sebagai pengguna, saya ingin dapat mengubah portofolio yang pernah saya buat secara manual, agar saya bisa memperbarui judul, deskripsi, kompetensi, hasil karya, atau pengaturan privasi sesuai kebutuhan saya.	Given user sudah login dan berada di halaman detail portofolio manual,When user klik tombol/ikon Edit/Ubah,Then sistem menampilkan form Ubah Portofolio Manual dengan semua field terisi sesuai data portofolio sebelumnya.
When Simpan Then “Perubahan portofolio berhasil disimpan.” Detail Portofolio
When user klik tombol Batalkan,Then sistem membatalkan proses edit dan mengembalikan user ke halaman detail portofolio tanpa menyimpan perubahan.
✅ Case: Ubah Detail Dokumen Portofolio (Manual & Otomatis)	Sebagai pengguna, saya ingin dapat mengubah informasi file hasil karya di portofolio saya (manual maupun otomatis), agar saya bisa memperbarui judul, refleksi, atau menjadikannya cover card sesuai kebutuhan.	Given user sudah login dan berada di halaman Detail Portofolio Manual/Otomatis, And portofolio memiliki minimal satu hasil karya, When user klik salah satu card hasil karya, Then sistem menampilkan Modal Informasi File dengan:
When user klik ikon Edit/Pensil di bagian Informasi File, Then field diubah menjadi mode edit: Judul File Refleksi Jadikan Sebagai Cover Card
When user klik tombol Simpan, Then sistem: “Informasi file berhasil diperbarui”
When Batalkan Then When X Then
❌ Negative Case	As a user I want melihat empty state di tab Portofolio So that saya tahu belum ada portofolio dan bisa menambahkan portofolio baru Acceptance Criteria / UAC:	Given user berada di halaman User ProfileWhen user membuka tab PortfolioThen sistem menampilkan empty state di tab Portofolio.
Given Then CTA “Tambah Portofolio”
As a user I want melihat error state ketika tab Portofolio gagal dimuatSo that saya dapat memahami ada kesalahan dan mencoba memuat ulang konten	Given user berada di halaman User Profile When user klik tab Portfolio dan terjadi error pada loading data Then sistem menampilkan error state dengan deskripsi: "Terjadi kesalahan saat memuat konten."
Given error state ditampilkanThen terdapat tombol “Muat Ulang Konten” yang dapat diklik.
Given user klik tombol “Muat Ulang Konten”Then sistem melakukan refresh pada tab Portofolio dan mencoba memuat data kembali.
✅ Lihat Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin melihat tab Sertifikat pada halaman profil saya, Sehingga saya dapat meninjau seluruh sertifikat yang saya miliki baik dari aktivitas di platform maupun yang saya unggah secara manual, dalam urutan terbaru ke terlama, dengan tampilan yang rapi dan mudah diakses.	Given user sudah login dan berada di halaman profil,When user memilih tab Sertifikat,Then sistem menampilkan daftar sertifikat milik user dalam bentuk card.
Given tab Sertifikat terbuka,When sistem menampilkan daftar sertifikat,Then hanya sertifikat dari program yang mengaktifkan toggle sertifikat di admin yang ditampilkan di tab ini.
Given tab Sertifikat terbuka,When sistem menampilkan daftar sertifikat,Then urutan sertifikat adalah dari yang terbaru ke yang terlama (newest to oldest).
Given jumlah sertifikat ≤ 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan semua sertifikat dalam satu halaman tanpa pagination.
Given jumlah sertifikat > 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan pagination dengan maksimal 12 card per halaman
Given sistem menampilkan daftar sertifikat, When setiap card ditampilkan, Then card berisi: “Platform” “Lainnya” Tahun Ajaran “Publik” “Privat” pin pensil
Given user melihat daftar sertifikat, When user mengklik salah satu card sertifikat, Then: platform (tribe 3) halaman detail sertifikat secara manual oleh user URL sertifikat
✅ Tambah Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat menambahkan sertifikat baru melalui tab Sertifikat di halaman profil saya, Sehingga saya dapat memperbarui portofolio saya dengan pelatihan atau sertifikasi terbaru yang saya ikuti, baik secara daring maupun luring.	Given user sudah login dan berada di halaman profil,When user membuka tab Sertifikat,Then sistem menampilkan tombol “Tambah Sertifikat”.
Given user mengklik tombol “Tambah Sertifikat”, When aksi dikonfirmasi, Then sistem menampilkan modal Tambah Sertifikat dengan field berikut: Jenis Pelatihan Sertifikasi Nama Pelatihan atau Sertifikasi Institusi Penyelenggara Tipe Penyelenggaraan Luring Daring Lokasi Penyelenggara Tipe = Luring Tanggal Mulai Tanggal Selesai checkbox Checkbox “Hanya berlangsung satu hari” Tautan Sertifikat
Given modal Tambah Sertifikat terbuka, When user mengisi data, Then sistem melakukan validasi real-time: Tautan Sertifikat Tanggal Selesai Tanggal Mulai
Given user telah mengisi semua field, When user menekan tombol “Simpan Perubahan”, Then sistem: valid tidak valid
Given proses penambahan sertifikat berhasil,When sistem menampilkan halaman tab Sertifikat,Then sertifikat baru langsung muncul di daftar sertifikat user (urutan sesuai newest to oldest) dan juga muncul di halaman detail profil user.
Given modal Tambah Sertifikat terbuka,When user menekan tombol “Batalkan”,Then sistem menutup modal tanpa menyimpan perubahan apa pun.
✅ Ubah Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat mengubah data sertifikat yang telah saya tambahkan sebelumnya melalui tab Sertifikat, Sehingga saya dapat memperbarui informasi sertifikat yang mungkin mengalami perubahan, seperti tanggal, nama pelatihan, atau tautan sertifikat.	Given user sudah login dan berada di halaman profil,When user membuka tab Sertifikat,Then sistem menampilkan daftar sertifikat dengan ikon pensil (✏️) pada setiap card untuk mengubah data.
Given terdapat minimal satu sertifikat yang sudah pernah ditambahkan, When user mengklik ikon pensil (✏️) pada salah satu card sertifikat, Then sistem menampilkan modal Ubah Sertifikat (UI sama seperti modal Tambah Sertifikat) dengan seluruh field otomatis terisi sesuai data lama: Jenis Pelatihan Sertifikasi Nama Pelatihan atau Sertifikasi Institusi Penyelenggara Tipe Penyelenggaraan Luring Daring Lokasi Penyelenggara Tipe = Luring Tanggal Mulai Tanggal Selesai checkbox “Hanya berlangsung satu hari” Checkbox “Hanya berlangsung satu hari” Tautan Sertifikat (opsional)
Given modal Ubah Sertifikat terbuka, When user mengubah satu atau beberapa field, Then sistem melakukan validasi real-time: Tautan Sertifikat Tanggal Selesai Tanggal Mulai
Given user telah melakukan perubahan data, When user menekan tombol “Simpan Perubahan”, Then sistem: valid Sertifikat profil user tidak valid
Given modal Ubah Sertifikat terbuka,When user menekan tombol “Batalkan”,Then sistem menutup modal tanpa menyimpan perubahan apa pun.
✅ Cari Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat mencari sertifikat berdasarkan nama melalui kolom pencarian, Sehingga saya dapat dengan cepat menemukan sertifikat tertentu tanpa harus menelusuri seluruh daftar sertifikat secara manual.	Given user sudah login dan berada di halaman tab Sertifikat, When halaman terbuka, Then sistem menampilkan kolom pencarian (search bar) dengan:
Given kolom pencarian tersedia,When user mengetikkan teks di kolom pencarian,Then sistem menunggu selama 300–500ms (debounce time) sebelum memproses pencarian untuk menghindari pemanggilan API berulang.
Given user telah mengetikkan kata kunci di kolom pencarian,When user menekan tombol Enter di keyboard atau ikon 🔍 di kolom pencarian,Then sistem memulai proses pencarian dan menampilkan loading indicator (misalnya spinner atau skeleton UI) selama data sedang dimuat.
Given sistem sedang memproses pencarian, When hasil ditemukan, Then sistem menampilkan daftar sertifikat yang nama/judulnya mengandung kata kunci pencarian (case-insensitive partial match), dengan urutan: abjad (ascending by name) relevansi kecocokan nama
Given sistem telah memproses pencarian, When tidak ditemukan sertifikat yang cocok, Then sistem menampilkan pesan: “Tidak ada sertifikat dengan nama tersebut.
Given user telah melakukan pencarian,When user menghapus teks dari kolom pencarian,Then sistem menampilkan kembali seluruh daftar sertifikat dalam default state (urutan terbaru ke terlama)
Given kolom pencarian tersedia,When user menggunakan perangkat mobile maupun desktop,Then tampilan kolom pencarian harus responsif dan tetap mudah diakses pada kedua mode tampilan tersebut
Given kolom pencarian aktif,When user menekan tombol Enter,Then sistem mengeksekusi fungsi pencarian (aksesibilitas keyboard-friendly)
Case: ✅ Filter Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat memfilter daftar sertifikat berdasarkan kriteria tertentu seperti status privasi, sumber, dan tahun ajaran, Sehingga saya dapat dengan mudah menampilkan sertifikat yang relevan dengan kebutuhan saya tanpa harus menelusuri seluruh daftar sertifikat.	Given user sudah login dan berada di halaman Sertifikat,When user mengklik tombol “Filter”,Then sistem menampilkan Modal Filter Sertifikat
Given modal Filter Sertifikat terbuka, When modal ditampilkan, Then sistem menampilkan tiga kategori filter berikut: Akses Profil Publik Privat Sumber Platform Lainnya Platform Lainnya Tahun Ajaran
Given modal Filter Sertifikat terbuka,When user mengklik tombol “X (Close)” di pojok kanan atas,Then modal tertutup tanpa menerapkan perubahan filter.
Given user telah memilih beberapa filter,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given user telah memilih satu atau beberapa opsi filter, When user menekan tombol “Terapkan Filter” di bagian bawah kanan modal, Then sistem: kriteria filter yang dipilih
Given filter telah diterapkan,When user melihat daftar sertifikat,Then hanya sertifikat yang memenuhi semua kriteria filter yang ditampilkan di daftar utama.
✅ Case: Pin Sertifikat	As a user,I want to pin up to 4 certificates in my portfolio,so that I can easily highlight and access my most important certificates at the top of the list.	Given user sudah login dan melihat daftar sertifikat di tab Portofolio,When user mengklik ikon Pin pada card sertifikat yang belum dipin,Then ikon berubah dari abu-abu menjadi biru dan card tersebut berpindah ke posisi paling atas kiri pada daftar portofolio.
Given user sudah login dan terdapat card yang sudah dipin (ikon biru),When user mengklik kembali ikon Pin pada card tersebut,Then ikon kembali menjadi abu-abu dan card berpindah ke posisi semula berdasarkan urutan waktu (newest → oldest).
Given user memiliki beberapa sertifikat,When user mem-pin satu atau lebih sertifikat,Then semua sertifikat yang dipin ditampilkan di baris paling atas, dari kiri ke kanan sesuai urutan pin terbaru ke terlama.
Given user sudah mem-pin beberapa sertifikat,When user melakukan pin pada sertifikat baru,Then card baru tersebut akan muncul di posisi paling kiri, dan card pinned sebelumnya bergeser ke kanan.
Given user sudah memiliki 4 sertifikat yang dipin,When user mencoba mem-pin sertifikat lain,Then ikon Pin pada sertifikat lain akan menjadi disabled (tidak dapat diklik).
And saat user hover pada ikon Pin yang disabled, Then sistem dapat menampilkan tooltip bertuliskan: “Maksimal pin adalah 4 sertifikat.”
Given When Then And Then
Given When Then secara langsung (real-time) And
✅ Case: Lihat Rapor	As a logged-in user,I want to view my list of report cards (rapor) in the Hasil Belajar tab,so that I can easily access and open detailed information about each report card.	Given user sudah login dan berada di tab Hasil Belajar,When user memilih atau membuka section Rapor,Then sistem menampilkan daftar rapor milik user.
Given terdapat beberapa rapor yang dimiliki user,When daftar rapor ditampilkan,Then sistem mengurutkan rapor berdasarkan waktu pembuatan dari newest to oldest.
And setiap halaman menampilkan maksimal 12 card rapor.If jumlah rapor > 12,Then sistem menampilkan pagination di bagian bawah daftar (misalnya: 1, 2, 3...).
Given When Then halaman detail rapor tab baru (new tab) And [Tribe 3 - halaman detail rapor]
Given When Then And loading skeleton feedback visual
✅ Case: Cari Rapor	As a logged-in user,I want to search for my report cards (rapor) by name,so that I can quickly find specific rapor without scrolling through the entire list.	Given user sudah login dan berada di halaman daftar Rapor, When halaman dimuat, Then sistem menampilkan search bar di bagian atas dengan: "Cari rapor"
Given When Then Enter 🔍 And case-insensitive partial match (contoh: mengetik “ux” akan menemukan “UX Design Rapor”)
When Then loading indicator Then Jika ditemukan, tampilkan daftar rapor sesuai: ascending by name
Given user telah melakukan pencarian,When user menghapus teks di kolom pencarian,Then sistem menampilkan kembali daftar rapor default (semua rapor terbaru berdasarkan urutan waktu: newest → oldest).
Case: ✅ Filter Rapor	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Rapor di halaman Rapor, Sehingga saya dapat memfilter daftar Rapor berdasarkan status privasi dan tahun ajaran, agar daftar Rapor yang ditampilkan sesuai dengan kebutuhan saya dan lebih mudah dicari.	Given user berada di halaman Rapor dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Rapor.
Given Modal Filter Rapor terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Rapor terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select): User dapat memilih satu atau beberapa tahun ajaran untuk mempersempit hasil Rapor.
Given Modal Filter Rapor terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Rapor terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Rapor terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Rapor yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list Rapor halaman utama.
Case: ✅ Lihat Laporan Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin membuka section Laporan Belajar di tab Laporan Belajar, Sehingga saya dapat melihat daftar seluruh laporan belajar saya dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail laporan jika diperlukan.	Given user sudah login,When user masuk ke section Laporan Belajar,Then sistem menampilkan daftar Laporan Belajar.
Given daftar Laporan Belajar ditampilkan,When sistem menampilkan laporan,Then urutan laporan adalah dari newest ke oldest
Given jumlah laporan ≤ 12,When sistem menampilkan daftar Laporan Belajar,Then semua laporan ditampilkan dalam satu halaman tanpa pagination.
Given jumlah laporan > 12,When sistem menampilkan daftar Laporan Belajar,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given sistem menampilkan daftar laporan belajar, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar laporan belajar,When user mengklik salah satu card laporan belajar,Then sistem membuka halaman detail laporan belajar di tab baru (tribe 3)
Case: ✅ Cari Laporan Hasil Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin mencari laporan hasil belajar berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar laporan.	Given user sudah login dan berada di halaman daftar laporan hasil belajar,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari laporan hasil belajar” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama laporan hasil belajar dan menekan Enter atau mengklik ikon 🔍,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar laporan hasil belajar yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada laporan hasil belajar dengan nama tersebut.”
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar laporan hasil belajar (default state).
Case: ✅ Filter Laporan Hasil Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Hasil Belajar di halaman Laporan Hasil Belajar, Sehingga saya dapat memfilter daftar laporan berdasarkan status privasi dan tahun ajaran, agar daftar laporan yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Hasil Belajar dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Belajar.
Given Modal Filter Laporan Hasil Belajar terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Hasil Belajar terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select): User dapat memilih satu atau beberapa tahun ajaran untuk mempersempit hasil laporan.
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Hasil Belajar yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list laporan halaman utama.
✅ Lihat Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin membuka section Laporan Perkembangan Murid di tab Hasil Belajar, Sehingga saya dapat melihat seluruh laporan perkembangan murid dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail laporan jika diperlukan.	Given user sudah login,When user masuk ke section Laporan Perkembangan Murid,Then sistem menampilkan daftar Laporan Perkembangan Murid.
Given daftar Laporan Perkembangan Murid ditampilkan,When sistem menampilkan laporan,Then urutan laporan adalah dari newest ke oldest.
Given jumlah laporan ≤ 12,When sistem menampilkan daftar laporan,Then semua laporan ditampilkan dalam satu halaman tanpa pagination.
Given jumlah laporan > 12,When sistem menampilkan daftar laporan,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given sistem menampilkan daftar laporan, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar laporan,When user mengklik salah satu card laporan perkembangan murid,Then sistem membuka halaman detail laporan perkembangan murid di tab baru (tribe 3).
Case: ✅ Cari Laporan Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin mencari laporan perkembangan murid berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar laporan.	Given user sudah login dan berada di halaman daftar laporan perkembangan murid,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari laporan perkembangan murid” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama laporan perkembangan murid dan menekan Enter atau mengklik ikon 🔍,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar laporan perkembangan murid yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada laporan perkembangan murid dengan nama tersebut.”
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar laporan perkembangan murid (default state).
Case: ✅ Filter Laporan Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Perkembangan Murid di halaman Laporan Perkembangan Murid, Sehingga saya dapat memfilter daftar laporan berdasarkan status privasi dan tahun ajaran, agar daftar laporan yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Perkembangan Murid dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Perkembangan Murid.
Given Modal Filter Laporan Perkembangan Murid terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Perkembangan Murid terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select):
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Perkembangan Murid yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list laporan halaman utama.
Case: ✅ Navigasi Pagination	Sebagai seorang pengguna yang sudah login, Saya ingin berpindah halaman daftar rapor, laporan hasil belajar, atau laporan perkembangan murid ketika jumlah item lebih dari 12, Sehingga saya dapat melihat semua data secara bertahap tanpa kehilangan urutan terbaru ke terlama.	Given user memiliki lebih dari 12 rapor/laporan hasil belajar/laporan perkembangan murid,When daftar ditampilkan,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given user melihat pagination,When user mengklik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 12 card sesuai halaman yang dipilih.
Given user berpindah halaman,When daftar ditampilkan,Then urutan tetap newest → oldest secara global di seluruh halaman.
Case: ❌ Halaman Gagal Diload	Sebagai seorang pengguna yang sudah login, Saya ingin mendapatkan informasi jika halaman atau section gagal dimuat, Sehingga saya tahu bahwa terjadi kesalahan dan dapat mencoba memuat ulang konten.	Given halaman atau section gagal diload karena kesalahan sistem atau jaringan, When user membuka halaman atau section tersebut, Then sistem menampilkan state error dengan:
Given state error ditampilkan,When user mengklik tombol “Muat Ulang Konten”,Then sistem mencoba memuat ulang halaman atau section tersebut (refresh).
Case: ✅ Lihat Hasil Assessment	Sebagai seorang pengguna yang memiliki minimal satu hasil assessment, Saya ingin membuka tab Laporan Hasil Assessment, Sehingga saya dapat melihat seluruh hasil assessment saya dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail assessment jika diperlukan.	Given user memiliki minimal satu hasil assessment,When user mengklik tab Laporan Hasil Assessment,Then sistem menampilkan semua hasil assessment di tab tersebut.
Given daftar hasil assessment ditampilkan,When sistem menampilkan laporan,Then urutan card adalah newest → oldest.
Given jumlah hasil assessment ≤ 12,When sistem menampilkan daftar,Then semua hasil assessment ditampilkan dalam satu section tanpa pagination.
Given jumlah hasil assessment > 12,When sistem menampilkan daftar,Then sistem menampilkan pagination (10 card per halaman).
Given sistem menampilkan daftar hasil assessment, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar hasil assessment,When user mengklik salah satu card,Then sistem membuka halaman detail assessment di tab baru (tribe 3).
Case: ✅ Cari Laporan Hasil Assessment	Sebagai seorang pengguna yang sudah login, Saya ingin mencari Laporan Hasil Assessment berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan hasil assessment tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user sudah login dan berada di halaman daftar Laporan Hasil Assessment,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari Laporan Hasil Assessment” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama Laporan Hasil Assessment dan menekan Enter atau mengklik ikon 🔍,Then sistem memproses pencarian
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar Laporan Hasil Assessment yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada Laporan Hasil Assessment dengan nama tersebut.
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar Laporan Hasil Assessment (default state).
✅ Filter Laporan Hasil Assessment	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Hasil Assessment di halaman Laporan Hasil Assessment, Sehingga saya dapat memfilter daftar hasil assessment berdasarkan status privasi dan tahun ajaran, agar daftar yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Hasil Assessment dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Assessment.
Given Modal Filter Laporan Hasil Assessment terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Hasil Assessment terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select):
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Hasil Assessment yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list halaman utama.
Case: ✅ Navigasi Pagination Portfolio	Sebagai seorang pengguna yang memiliki lebih dari 10 portofolio, Saya ingin berpindah halaman daftar portofolio, Sehingga saya dapat melihat seluruh portofolio secara bertahap tanpa kehilangan urutan terbaru ke terlama.	Given user memiliki lebih dari 10 portofolio,When daftar portofolio ditampilkan,Then sistem menampilkan pagination dengan maksimal 10 card per halaman.
Given user melihat pagination,When user mengklik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 10 card sesuai halaman yang dipilih
Given user berpindah halaman,When daftar ditampilkan,Then urutan card tetap newest → oldest secara global.
Case: ❌ Negative Case – Halaman Tab Laporan Hasil Assessment Gagal Diload	Sebagai seorang pengguna yang mengakses Laporan Hasil Assessment, Saya ingin mendapatkan informasi jika halaman gagal dimuat, Sehingga saya dapat mencoba memuat ulang konten dengan mudah.	Given halaman tab Laporan Hasil Assessment gagal diload, When user membuka tab tersebut, Then sistem menampilkan state error dengan:
Given When Then
Case: ✅ Lihat Aktivitas	Sebagai seorang pengguna yang memiliki minimal 1 aktivitas atau program yang telah diselesaikan, Saya ingin membuka tab Aktivitas, Sehingga saya dapat melihat seluruh aktivitas stand alone dan program yang sudah diselesaikan 100% dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta dapat mengakses halaman detail masing-masing aktivitas atau program.	Given user memiliki minimal 1 aktivitas atau program yang telah diselesaikan 100%,When user membuka tab Aktivitas,Then sistem menampilkan daftar aktivitas stand alone dan program yang sudah diselesaikan 100%.
Given daftar aktivitas ditampilkan,When sistem menampilkan card,Then aktivitas dengan completion rate < 100% tidak ditampilkan.
Given daftar aktivitas ditampilkan,When sistem menampilkan card,Then card program diurutkan dari newest → oldest.
Given jumlah aktivitas ≤ 10,When sistem menampilkan daftar,Then semua aktivitas ditampilkan dalam satu halaman tanpa pagination.
Given jumlah aktivitas > 10,When sistem menampilkan daftar,Then sistem menampilkan pagination dengan maksimal 10 card per halama
Given sistem menampilkan daftar aktivitas, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar aktivitas,When user mengklik salah satu card,Then sistem membuka halaman detail aktivitas stand alone atau detail program di tab baru (tribe 3).
✅ Case: Cari Aktivitas	Sebagai seorang pengguna yang sudah login, Saya ingin mencari aktivitas berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan aktivitas tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user sudah login dan berada di halaman daftar aktivitas,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari aktivitas” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama aktivitas dan menekan Enter atau mengklik ikon 🔍,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When aktivitas ditemukan,Then sistem menampilkan daftar aktivitas yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive partial match), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada aktivitas yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada aktivitas dengan nama tersebut.”
Given user menghapus teks pencarian atau mengklik tombol reset,When search bar kosong,Then sistem menampilkan kembali seluruh daftar aktivitas (default state)

User Story & User Acceptance Criteria

[TIPE 1 VISITOR VIEW]

Feature	User Story	User Acceptance Criteria (UAC)
Case: ✅ Lihat Cover Profile	Sebagai seorang pengguna atau pengunjung profile publik, Saya ingin melihat cover profile pada halaman User Profile atau halaman detail profil, Sehingga saya dapat melihat identitas visual pengguna yang bersangkutan, baik default maupun custom.	Given user membuka halaman User Profile atau detail profil,When akun yang diakses bersifat publik,Then sistem menampilkan Cover Profile di bagian paling atas halaman.
Given user belum pernah mengganti cover,When halaman ditampilkan,Then sistem menampilkan default cover image
Given user sudah pernah mengganti cover,When halaman ditampilkan,Then sistem menampilkan cover image milik user.
Case: ✅ Lihat Foto Profil	Sebagai seorang pengguna atau pengunjung profile publik, Saya ingin melihat foto profil pengguna pada halaman User Profile atau halaman Detail Profil, Sehingga saya dapat mengenali pengguna tersebut, baik melalui avatar default maupun foto profil yang telah diunggah.	Given user membuka halaman User Profile atau Detail Profil,When akun yang diakses bersifat publik,Then sistem menampilkan Foto Profil user di area atas halaman
Given user belum pernah mengunggah foto profil,When halaman ditampilkan,Then sistem menampilkan avatar default.
Given user sudah pernah mengunggah foto profil,When halaman ditampilkan,Then sistem menampilkan foto profil milik user
Case: ✅ Lihat Profil Side Bar	Sebagai seorang pengguna atau pengunjung profil publik, Saya ingin melihat Profil Sidebar pada halaman User Profile (tab manapun), Sehingga saya dapat meninjau informasi lengkap user dengan tampilan rapi dan sinkron dengan halaman detail profil.	Given user membuka halaman User Profile (pada tab manapun) dan akun bersifat publik, When halaman ditampilkan, Then sistem menampilkan Profil Sidebar dengan struktur dan informasi berikut: Header Profil: Foto Profil Nama Lengkap Bidang Pekerjaan / Job Title Alamat Tentang Saya Curriculum Vitae (CV) Situs Portofolio Media Sosial Bahasa Keahlian Bidang Pekerjaan Diminati
Given ada field yang tidak memiliki data,When sidebar ditampilkan,Then field tersebut tidak ditampilkan dan field di bawahnya akan naik menggantikan posisi field yang kosong.
Given sidebar ditampilkan,When data ditampilkan,Then seluruh data di sidebar harus sinkron dengan data yang ada di halaman detail profil.
Case: ✅ Lihat Detail Profil	Sebagai visitor yang membuka halaman profil user lain, Saya ingin melihat seluruh informasi publik user di tab Detail Profil, Sehingga saya dapat memahami identitas, pendidikan, pengalaman, prestasi, keahlian, minat pekerjaan, CV, portofolio, dan media sosial user secara lengkap.	Given When Detail Profil Then Section Identitas Diri Section Alamat Domisili Section Pendidikan Menampilkan daftar pendidikan formal user dengan elemen: Section Pengalaman Kerja Menampilkan daftar pengalaman kerja user dengan elemen: Section Pengalaman Organisasi Menampilkan daftar pengalaman organisasi user dengan elemen: Section Prestasi Menampilkan daftar prestasi user dengan elemen: Section Pelatihan & Sertifikasi Menampilkan daftar pelatihan & sertifikasi user dengan elemen: Section Bahasa Menampilkan daftar bahasa yang dikuasai user dengan: Section Keahlian Section Bidang Pekerjaan Diminati Section CV Section Portofolio Section Media Sosial General Behavior tidak ditampilkan hanya untuk informasi publik sinkron dengan data profil utama Negative Case Jika tab gagal dimuat → sistem menampilkan state error: Desc: Button:
Case: ❌ Section Kosong atau Detail Profil Gagal Diload	Sebagai seorang pengguna yang mengakses profil publik, Saya ingin sistem menyesuaikan tampilan jika ada section yang kosong atau gagal dimuat, Sehingga tampilan tetap rapi dan saya dapat mencoba memuat ulang data jika terjadi error.	Given ada section di sidebar yang tidak memiliki data,When halaman ditampilkan,Then section tersebut tidak ditampilkan dan section di bawahnya naik menggantikan posisi section yang kosong.
Given seluruh tab Detail Profil gagal dimuat, When user membuka tab Detail Profil, Then sistem menampilkan state error dengan:
Given state error ditampilkan,When user mengklik tombol “Muat Ulang”,Then sistem mencoba memuat ulang tab Detail Profil (refresh).
Case: ✅ Lihat Overview	Sebagai seorang pengunjung profil publik, Saya ingin membuka tab Overview pada halaman User Profile, Sehingga saya dapat melihat ringkasan data publik dari user secara cepat tanpa harus membuka tiap tab satu per satu.	Given user membuka tab Overview pada halaman User Profile, When akun yang diakses bersifat publik, Then sistem menampilkan beberapa section utama secara berurutan:
Given setiap section memiliki data publik,When ditampilkan,Then sistem menampilkan maksimal 2 card terbaru (latest) dari data publik di tab asal masing-masing section.
Given card ditampilkan,When user mengklik salah satu card,Then sistem mengarahkan user ke halaman detail card tersebut (tab asalnya).
Given setiap section ditampilkan, When header section terlihat, Then sistem menampilkan tombol “Lihat Semua”
Given suatu section belum memiliki data/card,When halaman Overview ditampilkan,Then section tersebut tidak ditampilkan dan section di bawahnya akan naik menggantikan posisi section kosong.
Given card ditampilkan di Overview,When ditampilkan,Then bentuk tampilan dan informasi pada card sama persis dengan yang terdapat pada tab asalnya.
Case: ✅ Lihat Portofolio	Sebagai seorang visitor (pengunjung) yang membuka profil user lain, Saya ingin melihat daftar portofolio publik user tersebut di tab Portofolio, Sehingga saya dapat meninjau portofolio yang telah dibagikan tanpa mengakses konten privat.	Given visitor membuka halaman profil user lain dan visitor bukan pemilik akun,When visitor klik tab Portfolio,Then sistem menampilkan daftar portofolio milik user yang bersifat Publik saja.
Given ada portofolio yang bersifat Privat,When halaman ditampilkan,Then portofolio tersebut tidak muncul pada tampilan visitor.
Given portofolio ditampilkan, When card ditampilkan, Then card menampilkan elemen sebagai berikut:
Given ada portofolio yang dipin oleh pemilik akun, When halaman ditampilkan, Then card tersebut ditampilkan sebagai “pinned” di bagian paling atas tidak interaktif
Given visitor mengklik salah satu card portofolio,When diklik,Then sistem mengarahkan visitor ke halaman Detail Portofolio.
Given daftar portofolio ditampilkan,When urutan diterapkan,Then urutan card portofolio adalah newest/latest → oldest.
Given jumlah portofolio ≤ 10,When ditampilkan,Then seluruh portofolio tampil dalam satu halaman tanpa pagination.
Given jumlah portofolio > 10,When ditampilkan,Then sistem menampilkan pagination dengan maksimal 10 card per halaman.
Given tab Portofolio bersifat privat, atau seluruh item portofolio bersifat privat, atau akun yang diakses tidak memiliki portofolio,When visitor membuka profil,Then tab Portofolio tidak ditampilkan dan tab di sebelahnya bergeser menggantikan posisi tab Portofolio.
Case: ✅ Cari Portofolio	Sebagai seorang visitor yang membuka profil user lain, Saya ingin mencari portofolio berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan portofolio publik yang relevan tanpa harus menelusuri seluruh daftar secara manual.	Given visitor membuka halaman daftar portofolio user lain,When halaman ditampilkan,Then sistem menampilkan search bar dengan placeholder “Cari portofolio” dan ikon pencarian di sisi kanan.
Given visitor mengetikkan nama portofolio pada kolom pencarian,When visitor selesai memasukkan kata kuncinya,Then sistem menampilkan hasil portofolio yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive, partial match).
Given sistem memproses pencarian,When proses berlangsung,Then tampilkan loading indicator (misal: spinner atau skeleton UI).
Given hasil pencarian diterima,When ditemukan portofolio yang sesuai,Then tampilkan daftar portofolio sesuai urutan abjad (ascending by name) atau relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ditemukan portofolio yang sesuai,Then tampilkan pesan: “Tidak ada portofolio dengan nama tersebut.”
Given visitor menghapus teks pencarian,When kolom pencarian kosong,Then sistem menampilkan kembali seluruh daftar portofolio (default state).
Case: ✅ Filter Portofolio	Sebagai seorang visitor yang membuka halaman Portofolio user lain, Saya ingin memfilter portofolio berdasarkan status privasi, sumber, dan tahun ajaran, Sehingga saya dapat menampilkan portofolio publik yang relevan dengan kriteria yang saya inginkan.	Given user berada di halaman Portofolio, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Portofolio dengan opsi filter berikut: Akses Profil Sumber Tahun Ajaran
Given modal ditampilkan,When user klik tombol “X” (Close) di pojok kanan atas,Then modal tertutup tanpa menerapkan perubahan filter.
Given modal ditampilkan,When user klik tombol “Reset” di bagian bawah kiri,Then semua pilihan filter dikosongkan dan kembali ke kondisi default.
Given user memilih filter dan klik tombol “Terapkan Filter” di bagian bawah kanan,When tombol diklik,Then modal tertutup dan sistem menampilkan daftar portofolio sesuai kriteria filter yang dipilih.
Given hasil filter diterapkan,When daftar portofolio ditampilkan,Then hasil filter langsung terlihat pada tampilan list portofolio di halaman utama.
Case: ✅ Navigasi Pagination	Sebagai seorang visitor yang membuka halaman Portofolio user lain, Saya ingin berpindah halaman pada daftar portofolio, Sehingga saya dapat melihat seluruh portofolio yang tersedia meskipun jumlahnya lebih dari 10 card per halaman.	Given user memiliki lebih dari 10 portofolio,When user klik tombol pagination (misal: Halaman 2),Then sistem menampilkan daftar maksimal 10 card portofolio sesuai halaman yang dipilih.
Given When Then newest → oldest
Case: ✅ Lihat Detail Portofolio (Otomatis)	Sebagai seorang visitor yang membuka profil user lain, Saya ingin melihat detail portofolio otomatis yang bersifat publik, Sehingga saya dapat meninjau informasi lengkap dan konten portofolio milik user tersebut tanpa mengakses portofolio privat.	Given visitor membuka halaman profil user lain,When visitor klik salah satu card portofolio otomatis publik,Then sistem menampilkan halaman detail portofolio.
Given halaman detail portofolio terbuka,When portofolio ditampilkan,Then hanya portofolio dengan status Publik yang ditampilkan.
Given halaman detail portofolio terbuka, When data portofolio ditampilkan, Then sistem menampilkan:
Given halaman detail portofolio menampilkan konten, When sistem menampilkan preview konten portofolio, Then tampil grid card berdasarkan jenis file (dokumen, foto, audio, video, dokumen lainnya)
Case: ✅ Lihat Detail Portofolio (Manual)	Sebagai seorang visitor yang membuka profil user lain, Saya ingin melihat detail portofolio manual yang bersifat publik, Sehingga saya dapat meninjau informasi lengkap dan konten portofolio milik user tersebut tanpa mengakses portofolio privat atau melakukan perubahan.	Given visitor membuka halaman profil user lain,When visitor klik salah satu card portofolio manual publik,Then sistem menampilkan halaman detail portofolio.
Given halaman detail portofolio terbuka,When portofolio ditampilkan,Then hanya portofolio dengan status Publik yang ditampilkan.
Given halaman detail portofolio terbuka, When data portofolio ditampilkan, Then sistem menampilkan:
Given halaman detail portofolio menampilkan konten, When sistem menampilkan preview konten portofolio, Then tampil grid card berdasarkan jenis file (dokumen, foto, audio, video, dokumen lainnya)

Case: ✅ Lihat Detail Dokumen Portofolio	Sebagai seorang visitor yang membuka halaman detail portofolio publik, Saya ingin membuka preview salah satu dokumen portofolio, Sehingga saya dapat meninjau konten dokumen dan informasi terkait tanpa meninggalkan halaman detail portofolio.	Given visitor berada di halaman detail portofolio publik,When visitor klik salah satu card dokumen/konten portofolio,Then sistem membuka modal preview dokumen.
Given modal preview terbuka, When sistem menampilkan konten, Then preview dokumen ditampilkan di sisi kiri modal sesuai jenis file: Foto Video Audio Dokumen (PDF/Word/PPT) URL/Link
Given modal preview terbuka, When sistem menampilkan informasi file, Then di sisi kanan modal ditampilkan:
Given visitor menutup modal,When modal ditutup,Then visitor kembali ke halaman detail portofolio tanpa perubahan tampilan sebelumnya.
Case: ✅ Lihat Sertifikat	Sebagai visitor yang membuka profil user lain, Saya ingin melihat daftar sertifikat publik milik user, Sehingga saya dapat meninjau sertifikat yang bersifat publik tanpa dapat melakukan perubahan atau melihat sertifikat privat.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Sertifikat, Then sistem menampilkan daftar sertifikat user dengan ketentuan:
Given sertifikat ditampilkan,When sistem menampilkan daftar sertifikat,Then sertifikat diurutkan dari newest → oldest berdasarkan tanggal penerbitan.
Given daftar sertifikat ditampilkan,When jumlah sertifikat ≤ 12,Then sistem menampilkan semua sertifikat dalam satu halaman tanpa pagination.
Given jumlah sertifikat > 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given setiap card sertifikat ditampilkan, When card tampil, Then card menampilkan elemen berikut:
Given visitor klik salah satu card sertifikat, Then: Detail Sertifikat URL sertifikat
Given seluruh sertifikat bersifat privat atau tab tidak memiliki sertifikat publik,Then tab Sertifikat tidak ditampilkan dan tab di sebelahnya bergeser.
Case: ✅ Cari Sertifikat	Sebagai pengguna yang ingin meninjau sertifikat saya atau publik milik user lain, Saya ingin mencari sertifikat berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan sertifikat tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user berada di halaman daftar sertifikat,When sistem menampilkan halaman,Then tampilkan search bar dengan placeholder “Cari sertifikat” dan ikon pencarian di sisi kanan.
Given user mengetikkan kata kunci pada kolom pencarian,When user selesai memasukkan kata kuncinya 🔍,Then sistem memproses pencarian (case-insensitive).
Given sistem sedang memproses pencarian,Then tampilkan loading indicator (misal: spinner atau skeleton UI).
Given hasil pencarian diterima, Then: urutan abjad (ascending by name) relevansi kecocokan nama
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar sertifikat (default state).
Additional Notes: case-insensitive partial match
Case: ✅ Filter Sertifikat	Sebagai pengguna yang ingin meninjau sertifikat tertentu, Saya ingin memfilter sertifikat berdasarkan sumber dan tahun ajaran melalui modal filter, Sehingga saya dapat melihat sertifikat yang relevan dengan kriteria yang saya pilih tanpa menelusuri seluruh daftar.	Given user berada di halaman daftar sertifikat,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Sertifikat.
Given modal filter terbuka, Then sistem menampilkan opsi filter: Sumber Tahun Ajaran
Given user ingin menutup modal tanpa menerapkan filter,When user klik tombol X (Close),Then modal tertutup dan tidak ada perubahan filter yang diterapkan.
Given user ingin mengosongkan semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter kembali ke kondisi awal (default).
Given user sudah memilih kriteria filter,When user klik tombol Terapkan Filter,Then modal tertutup dan sistem menampilkan daftar sertifikat sesuai kriteria yang dipilih.
Given filter diterapkan,Then hasil filter langsung terlihat pada tampilan list sertifikat di halaman utama.
Case: ✅ Lihat Rapor	Sebagai visitor yang mengunjungi profil user lain, Saya ingin melihat section Rapor pada tab Hasil Belajar, Sehingga saya dapat meninjau rapor publik milik user tanpa memiliki akses sebagai pemilik akun.	Given visitor membuka halaman profil user lain,When visitor masuk ke tab Hasil Belajar dan memilih section Rapor,Then sistem menampilkan daftar rapor publik milik user.
Given rapor ditampilkan,Then rapor diurutkan berdasarkan tanggal penerbitan dari newest → oldest.
Given jumlah rapor ≤ 12,Then semua rapor ditampilkan dalam satu halaman tanpa pagination.
Given jumlah rapor > 12,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given rapor ditampilkan, Then setiap card menampilkan:
Given visitor mengklik salah satu card rapor,Then sistem membuka halaman detail rapor (Tribe 3) pada tab baru.
Given tab Rapor bersifat privat, atau seluruh item bersifat privat, atau akun tidak memiliki rapor publik,Then tab Rapor tidak ditampilkan, dan tab di sebelahnya akan bergeser menggantikannya.
Case: ✅ Cari Rapor	Sebagai user yang ingin menemukan rapor tertentu, Saya ingin mencari rapor berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menampilkan rapor yang relevan tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar rapor,Then sistem menampilkan search bar dengan placeholder “Cari rapor” dan ikon pencarian di sisi kanan.
Given user mengetikkan nama rapor,When user selesai memasukkan kata kuncinya 🔍,Then sistem menampilkan rapor yang nama/judulnya mengandung kata kunci (case-insensitive partial match).
Given sistem memproses pencarian,Then tampilkan loading indicator (misal spinner atau skeleton UI) sampai hasil diterima.
Given rapor ditemukan,Then tampilkan daftar rapor sesuai urutan abjad (ascending by name) atau relevansi kecocokan nama.
Given rapor tidak ditemukan, Then tampilkan pesan: “Tidak ada rapor dengan nama tersebut.”
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar rapor (default state).
Case: ✅ Filter Rapor	Sebagai user yang ingin menampilkan rapor sesuai kriteria tertentu, Saya ingin menggunakan modal filter rapor untuk memilih status privasi dan tahun ajaran, Sehingga saya dapat melihat daftar rapor yang relevan tanpa harus menelusuri semua rapor secara manual.	Given user berada di halaman Rapor,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Rapor.
Given modal terbuka, Then tampil opsi Akses Profil: Publik, Privat
Given modal terbuka, Then tampil opsi Tahun Ajaran (multi-select):
Given user mengklik tombol X (Close) di pojok kanan atas modal,Then modal tertutup tanpa menerapkan filter.
Given user mengklik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user mengklik tombol Terapkan Filter,Then sistem menutup modal dan menampilkan daftar rapor sesuai kriteria filter yang dipilih.
Given filter diterapkan,Then hasil filter langsung ditampilkan pada list Rapor di halaman utama.
Case: ✅ Lihat Laporan Belajar (Visitor)	Sebagai visitor yang melihat profil user lain, Saya ingin melihat daftar Laporan Belajar publik, Sehingga saya dapat mengetahui pencapaian belajar user tanpa harus login atau memiliki akses khusus.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Hasil Belajar dan memilih section Laporan Belajar, Then sistem menampilkan daftar Laporan Belajar dengan ketentuan berikut: Publik Privat newest → oldest 12 card pagination
Given daftar card ditampilkan, Then setiap card menampilkan:
Given visitor mengklik salah satu card Laporan Belajar,Then sistem membuka halaman detail Laporan Belajar (Tribe 3) di tab baru.
Given seluruh item Laporan Belajar bersifat privat atau tidak ada data publik,Then tab Laporan Belajar tidak ditampilkan, dan tab sebelahnya akan bergeser.
Case: ✅ Cari Laporan Belajar	Sebagai user yang terdaftar, Saya ingin mencari Laporan Belajar berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus men-scroll seluruh daftar.	Given user membuka halaman daftar Laporan Belajar,Then sistem menampilkan search bar dengan placeholder “Cari Laporan Belajar” dan ikon pencarian di sisi kanan.
Given user mengetikkan nama Laporan Belajar di kolom pencarian, When user selesai memasukkan kata kuncinya, Then sistem menampilkan daftar Laporan Belajar yang nama/judulnya mengandung kata kunci (case-insensitive).
Given pencarian sedang diproses,Then tampilkan loading indicator (spinner atau skeleton UI) hingga hasil diterima.
Given hasil pencarian diterima, Then sistem: urut abjad (ascending)
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar Laporan Belajar (default state).
Case: ✅ Filter Laporan Belajar	Sebagai user yang terdaftar, Saya ingin memfilter Laporan Hasil Belajar berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menemukan laporan tertentu sesuai kriteria yang saya pilih dengan cepat.	Given user berada di halaman Laporan Hasil Belajar,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Belajar.
Given Modal Filter terbuka, Then user dapat memilih Akses Profil:
Given Modal Filter terbuka, Then user dapat memilih Tahun Ajaran (multi-select):
Given user ingin menutup modal tanpa menerapkan filter,When user klik tombol “X” (Close),Then modal akan tertutup tanpa mengubah daftar Laporan Hasil Belajar.
Given user ingin menghapus semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user sudah memilih kriteria filter,When user klik tombol Terapkan Filter,Then modal akan tertutup,And sistem menampilkan daftar Laporan Hasil Belajar sesuai kriteria filter yang dipilih, langsung diterapkan pada halaman utama.
Case: ✅ Lihat Perkembangan Murid	Sebagai visitor yang mengakses profil user lain, Saya ingin melihat daftar Laporan Perkembangan Murid yang bersifat publik, Sehingga saya dapat mengetahui perkembangan murid tanpa perlu login sebagai pemilik akun.	Given visitor membuka halaman profil user lain,When visitor masuk ke tab Hasil Belajar dan memilih section Laporan Perkembangan Murid,Then sistem menampilkan daftar Laporan Perkembangan Murid yang bersifat publik.
Given visitor melihat daftar Laporan Perkembangan Murid, Then setiap card menampilkan informasi berikut:
Given visitor klik salah satu card Laporan Perkembangan Murid,Then sistem membuka halaman detail laporan pada tab baru (Tribe 3).
Given jumlah laporan lebih dari 12,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given tab bersifat privat, atau seluruh item bersifat privat, atau akun yang diakses tidak memiliki data,Then tab tidak ditampilkan dan tab di sebelahnya bergeser.
Given visitor bukan pemilik akun,Then tidak ada ikon aksi (edit, pin, dsb) yang ditampilkan.
Case: ✅ Cari Laporan Perkembangan Murid	Sebagai user yang telah login, Saya ingin mencari Laporan Perkembangan Murid berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar Laporan Perkembangan Murid,Then sistem menampilkan search bar dengan placeholder: “Cari laporan perkembangan murid” dan ikon pencarian di sisi kanan.
Given user mengetikkan kata kunci pada kolom pencarian,When user selesai memasukkan kata kuncinya,Then sistem menampilkan hasil laporan perkembangan murid yang nama/judulnya mengandung kata kunci (case-insensitive).
Given proses pencarian sedang berlangsung,Then tampilkan loading indicator (misal spinner atau skeleton UI).
Given hasil pencarian diterima: urutan abjad (ascending by name) relevansi kecocokan nama
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar laporan perkembangan murid (default state).
Case: ✅ Filter Laporan Perkembangan Murid	Sebagai user yang telah login, Saya ingin memfilter Laporan Perkembangan Murid berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menampilkan laporan yang relevan dengan cepat sesuai kebutuhan saya.	Given user berada di halaman Laporan Perkembangan Murid, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Laporan Perkembangan Murid dengan opsi: Akses Profil Tahun Ajaran
Given user ingin menutup modal tanpa mengubah filter,When user klik tombol X (Close),Then modal ditutup tanpa menerapkan perubahan filter.
Given user ingin menghapus semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user telah memilih kriteria filter,When user klik tombol Terapkan Filter,Then sistem menutup modal dan menampilkan daftar Laporan Perkembangan Murid sesuai filter yang dipilih.
Given hasil filter diterapkan,Then tampilan daftar langsung diperbarui di halaman utama tanpa perlu refresh manual.
Case: ✅ Navigasi Pagination	Sebagai user yang telah login, Saya ingin berpindah halaman daftar Rapor / Laporan Hasil Belajar / Laporan Perkembangan Murid menggunakan pagination, Sehingga saya dapat melihat seluruh data secara terstruktur dan tidak terbatas pada halaman pertama saja.	Given user memiliki lebih dari 12 item (rapor, laporan hasil belajar, atau laporan perkembangan murid),When user klik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 12 card sesuai halaman yang dipilih.And urutan card tetap newest → oldest secara global.
Given sistem sedang memuat data halaman yang dipilih,Then tampilkan loading indicator (misal spinner atau skeleton UI) sampai data selesai dimuat.
Negative Case Given Then sistem menampilkan state error: Desc: Button:
Case: ✅ Lihat Hasil Assessment	Sebagai visitor yang membuka profil user lain, Saya ingin melihat tab Laporan Hasil Assessment, Sehingga saya dapat mengetahui hasil assessment yang bersifat publik milik user tersebut.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Laporan Hasil Assessment, Then sistem menampilkan daftar hasil assessment publik user dengan ketentuan: newest → oldest 12 card per halaman pagination
Case: ✅ Cari Laporan Hasil Assessment	Sebagai user yang telah login, Saya ingin mencari Laporan Hasil Assessment berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat.	Given Laporan Hasil Assessment When Then hasil assessment mengandung kata kunci During Search: loading indicator After Search: abjad (ascending by name) relevansi nama Reset / Clear Search:
Case: ✅ Filter Laporan Hasil Assessment	Sebagai user yang telah login, Saya ingin memfilter Laporan Hasil Assessment berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menampilkan laporan yang relevan sesuai kriteria yang saya pilih.	Given Laporan Hasil Assessment When Filter Then Modal Filter Laporan Hasil Assessment Tahun Ajaran: Modal Buttons: Close (X): Reset: Terapkan Filter: Filter Application: langsung diterapkan
✅ Case: Lihat Aktivitas	Sebagai visitor yang membuka profil user lain, Saya ingin melihat aktivitas dan program yang sudah diselesaikan 100% dan bersifat publik, Sehingga saya dapat menilai capaian user tanpa melihat aktivitas yang belum selesai atau bersifat privat.	Given visitor membuka tab Aktivitas pada halaman profil user lain, When user pemilik akun memiliki minimal satu aktivitas atau program publik yang selesai 100%, Then sistem menampilkan daftar aktivitas/public program dengan ketentuan: completion rate = 100% publik newest → oldest Pagination:
Case: ✅ Cari Aktivitas	Sebagai visitor yang membuka profil user lain, Saya ingin mencari aktivitas berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan aktivitas tertentu tanpa harus menelusuri semua card aktivitas.	Given When Then nama/judulnya mengandung kata kunci Pencarian dimulai ketika: Selama proses pencarian: loading indicator Setelah hasil diterima: urutan abjad (ascending by name) Reset atau hapus teks pencarian:
Case: ✅ Filter Aktivitas	Sebagai visitor atau user yang membuka halaman Aktivitas, Saya ingin memfilter aktivitas berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat melihat daftar aktivitas yang relevan sesuai kriteria saya.	Given When Filter Then Modal Filter Aktivitas Akses Profil: Tahun Ajaran: Tombol dalam modal: Close (X): Reset: Terapkan Filter: Hasil filter: Negative Case: Jika halaman gagal dimuat, sistem menampilkan state error: Desc: Button:

User Story & User Acceptance Criteria

[TIPE 2 OWNER VIEW]

Feature	User Story	User Acceptance Criteria (UAC)
✅ Case Lihat Cover	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Cover Profile saya di bagian atas halaman profil, sehingga saya dapat mengenali akun saya dengan mudah dan memiliki opsi untuk mengganti cover jika diinginkan.	Given user sudah login,When user membuka halaman User Profile (tab manapun) atau detail profil,Then sistem menampilkan Cover Profile di bagian paling atas halaman.
Given user belum pernah mengganti cover,When halaman profil dimuat,Then sistem menampilkan default cover image.
Given user sudah pernah mengganti cover,When halaman profil dimuat,Then sistem menampilkan cover image milik user.
Given halaman profil menampilkan Cover Profile,When cover dimuat,Then sistem menampilkan icon Pensil/Edit di pojok kanan atas cover.
Given user mengklik icon Pensil/Edit di cover,When user melakukan aksi klik,Then sistem menampilkan modal Ubah Cover Image.
✅ Case Ubah Cover	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus Cover Profile saya melalui modal, sehingga saya bisa menyesuaikan tampilan profil saya sesuai preferensi.	Given user sudah login dan berada di halaman profil, When user klik icon Pensil / tombol Ubah di pojok kanan atas cover, Then sistem menampilkan Modal Ubah Cover Image yang berisi:
Given cover saat ini adalah default,When user melihat tombol Hapus Cover,Then tombol berada dalam keadaan disabled dan tidak bisa diklik.
Given cover saat ini adalah custom, When user klik tombol Hapus Cover, Then sistem menampilkan pop-up konfirmasi dengan pesan: “Hapus Cover? Jika cover image dihapus, sistem secara otomatis akan menggunakan cover image standar.”
Given user klik Batalkan pada pop-up,When aksi dikonfirmasi,Then pop-up tertutup dan user kembali ke modal tanpa perubahan.
Given user klik Hapus pada pop-up, When aksi dikonfirmasi, Then sistem:
Given user klik tombol X (Close) pada modal,When aksi diklik,Then modal tertutup dan perubahan dibatalkan, cover tidak berubah.
Given user klik tombol Ganti Cover,When tombol diklik,Then sistem membuka File Manager (desktop/mobile) dengan filter file .jpg, .jpeg, .png.
Given user memilih file gambar dari perangkat, When file berhasil diunggah, Then sistem menampilkan preview cover baru di modal dengan fitur:
Given user klik tombol X (Close) setelah memilih cover baru,When aksi diklik,Then modal tertutup dan perubahan dibatalkan, cover tidak berubah.
Given user klik tombol Simpan Perubahan setelah memilih cover baru,When aksi diklik,Then sistem menyimpan cover baru, menampilkan notifikasi “Cover berhasil diperbarui,” dan cover di halaman profil langsung diperbarui.
✅ Case: Lihat Foto Profil	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Foto Profil saya di halaman profil, sehingga saya dapat mengenali akun saya dengan mudah dan memiliki opsi untuk menambahkan atau mengganti foto profil jika diperlukan.	Given user sudah login,When user membuka halaman User Profile atau Detail Profil,Then sistem menampilkan Foto Profil user di area atas halaman.
Given user belum pernah mengunggah foto profil,When halaman profil dimuat,Then sistem menampilkan avatar default.
Given user sudah pernah mengunggah foto profil,When halaman profil dimuat,Then sistem menampilkan foto profil milik user
Given halaman profil menampilkan Foto Profil,When foto profil dimuat,Then sistem menampilkan ikon Pensil/Edit di pojok kanan bawah foto.
Given user mengklik ikon Pensil/Edit, When aksi diklik, Then sistem menampilkan modal sesuai kondisi: Jika sebelumnya belum ada foto Jika sudah ada foto
✅ Case Tambah Foto Profil	Sebagai seorang pengguna platform yang sudah login dan belum memiliki foto profil, saya ingin dapat menambahkan foto profil baru melalui modal, sehingga foto saya dapat ditampilkan di rapor, laporan belajar, sertifikat, dan halaman profil.	Given user sudah login dan foto profil saat ini masih avatar default, When user klik ikon Ubah Foto Profil pada halaman profil, Then sistem menampilkan Modal Tambahkan Foto Profil yang berisi:
Given user klik tombol Tambah Foto Profil, When tombol diklik, Then sistem membuka File Manager (desktop/mobile) dengan filter file:
Given user memilih file gambar dari perangkat, When file berhasil dipilih, Then sistem menampilkan Modal Atur Foto Profil dengan komponen:
Given user telah mengatur foto profil sesuai keinginan, When user klik tombol Simpan, Then sistem:
✅ Case Ubah / Hapus Foto Profil	Sebagai seorang pengguna platform yang sudah login dan memiliki foto profil custom, saya ingin dapat mengganti atau menghapus foto profil saya melalui modal, sehingga saya bisa memperbarui tampilan akun sesuai preferensi atau kembali ke avatar default.	Given user sudah login dan foto profil saat ini adalah custom, When user klik icon Ubah Foto Profil pada halaman profil, Then sistem menampilkan Modal Ubah Foto Profil dengan:
Given user klik tombol Ubah Foto Profil,When tombol diklik,Then sistem membuka File Manager (desktop/mobile) dengan filter file: .jpg, .jpeg, .png.
Given user memilih file gambar baru dari perangkat, When file berhasil dipilih, Then sistem menampilkan Modal Atur Foto Profil dengan:
Given user sudah menyesuaikan foto,When user klik tombol Simpan,Then sistem menyimpan perubahan, menutup modal, menampilkan notifikasi “Foto profil berhasil diperbarui,” dan memperbarui foto profil di halaman profil secara langsung.
Given user klik tombol Hapus Foto Profil, When tombol diklik, Then sistem menampilkan Modal Konfirmasi Hapus Foto Profil dengan:
Given user klik Batalkan,When aksi dikonfirmasi,Then modal tertutup, dan foto profil tetap sama.
Given user klik Hapus Foto Profil,When aksi dikonfirmasi,Then sistem mengganti foto profil menjadi avatar default, menutup modal, dan menampilkan notifikasi “Foto profil berhasil dihapus.”
✅ Case: Lihat Status Privasi Akun	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat status privasi akun saya di halaman profil, sehingga saya dapat mengetahui apakah akun saya bersifat Privat atau Publik dan diarahkan ke pengaturan privasi jika ingin mengubahnya.	Given user sudah login,When user membuka halaman User Profile atau Detail Profil,Then sistem menampilkan ikon gembok di sebelah kanan Nama Lengkap user.
Given ikon gembok dalam kondisi terkunci (lock),When halaman profil dimuat,Then status akun user adalah Privat.
Given ikon gembok dalam kondisi terbuka (unlock),When halaman profil dimuat,Then status akun user adalah Publik.
Given user belum mengubah pengaturan privasi,When halaman profil dimuat pertama kali,Then status privasi akun diset sebagai Privat (ikon terkunci).
Given user mengklik ikon gembok,When aksi diklik,Then sistem membuka halaman Pengaturan Akun (di tab baru) spesifik pada tab pengaturan privasi profil.
✅ Case: Lihat Profil Side Bar	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat Profil Sidebar di halaman User Profile, sehingga saya dapat melihat ringkasan informasi akun user dengan jelas dan dapat mengakses detail lebih lanjut atau berbagi profil dengan mudah.	Given user sudah login, When user membuka halaman User Profile (tab manapun), Then sistem menampilkan Profil Sidebar di sisi kiri halaman dengan: Foto Profil:
Given akun user memiliki status verifikasi, When user menghover icon status verifikasi, Then sistem menampilkan informasi verifikasi akun.
Given sidebar menampilkan icon Privacy (gembok), When diklik, Then user diarahkan ke halaman pengaturan akun spesifik tab privasi profil.
Given data tersedia, Then sidebar menampilkan: Nomor Ponsel: Alamat Lengkap:
Given sidebar menampilkan tombol “Informasi Pribadi”,When user klik tombol,Then sistem redirect ke halaman detail profil user.
Given When Then sistem menampilkan modal bagikan dengan opsi:
✅ Case: Bagikan Profil	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat membagikan profil saya melalui tombol Bagikan, sehingga saya bisa membagikan portofolio dan informasi profil ke teman atau media sosial dengan mudah.	Given user sudah login,When user membuka halaman User Profile (di tab manapun),Then sistem menampilkan tombol Bagikan di profil header.
Given When Then sistem menampilkan opsi berbagi:
Given Copy Link (both from page overview and portofolio) When Then "Yuk, lihat portofolio belajarku di [nama platform]: [url profil user]" Given Then "Link profil berhasil disalin"
Given (both from page overview and portofolio) When Then "Yuk, lihat portofolio belajarku di [nama platform]: [url profil user]"
Given user klik tombol Bagikan sementara status privasi akun masih Privat,When aksi diklik,Then sistem menampilkan pop-up dengan informasi bahwa akun privat dan CTA mengarahkan user ke halaman pengaturan akun spesifik tab privasi profil.
✅ Case: Lihat Data Personal	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat data personal saya di tab Detail Profil, sehingga saya dapat mengetahui informasi akun saya secara lengkap dan dapat mengeditnya jika diperlukan.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan informasi berikut: Nama Lengkap Jenis Kelamin Tanggal Lahir Email → menampilkan alamat email user beserta badge status verifikasi (Verified / Unverified) Nomor Ponsel Deskripsi Diri
Given When Then Edit (Pensil) Edit Data Personal
✅ Case: Ubah Data Personal	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah data personal saya melalui modal, sehingga informasi akun saya tetap akurat dan up-to-date.	Given user sudah login dan berada di tab Detail Profil, When user klik ikon Edit (Pensil) pada section Data Personal, Then sistem menampilkan modal Edit Data Personal yang berisi field: Jenis Kelamin Tanggal Lahir Nomor Ponsel Deskripsi Diri Simpan Batalkan / Close
Given When Simpan Then sistem melakukan validasi data. "Perubahan berhasil disimpan"
Given user berada di modal Edit Data Personal,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan, section Data Personal tetap menampilkan data sebelumnya.
✅ Case: Lihat Identitas Resmi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat identitas resmi saya di tab Detail Profil dengan proteksi data sensitif, sehingga saya bisa memastikan data saya tercatat dengan benar tanpa risiko kebocoran informasi.	Given When Detail Profil Then Kewarganegaraan Jenis Dokumen Nomor Identitas Given Then '-'
Given nomor identitas ditampilkan dengan masking, Then masking berlaku tidak hanya pada tampilan halaman tetapi juga saat inspect code.
Given user melihat identitas resmi, Then sistem menampilkan: Icon Visibility (Mata) Icon Edit (Pensil) Edit Identitas Resmi
✅ Case: Ubah Identitas Resmi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah data identitas resmi saya melalui modal, sehingga informasi resmi saya selalu akurat dan tersinkronisasi dengan sistem administrasi.	Given user sudah login dan berada di tab Detail Profil, When user klik icon Edit (Pensil) pada section Identitas Resmi, Then sistem menampilkan modal Edit Identitas Resmi dengan field: Kewarganegaraan Jenis Dokumen Nomor Induk Kependudukan / Visa / Paspor / KITAS / KITAP Simpan Batalkan / Close
Given user telah mengisi field dengan benar, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Kelola Pengguna
Given user berada di modal Edit Identitas Resmi,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan
✅ Case: Lihat Alamat Domisili	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat alamat domisili saya secara lengkap di halaman profil, sehingga saya bisa memastikan data alamat tercatat dengan benar dan dapat mengeditnya jika diperlukan.	Given user sudah login, When user membuka section Identitas Resmi, Then sistem menampilkan alamat domisili user secara lengkap.
Given alamat lengkap tersedia, Then sistem menampilkan link Google Maps,
Given user melihat alamat domisili,Then sistem menampilkan icon Edit (Pensil) untuk membuka modal Edit Alamat Domisil
✅ Case: Ubah Alamat Domisili	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah alamat domisili saya melalui modal, sehingga data alamat saya selalu akurat dan tersinkronisasi dengan sistem administrasi.	Given user sudah login dan berada di section Identitas Resmi, When user klik icon Edit (Pensil) pada Alamat Domisili, Then sistem menampilkan modal Edit Alamat Domisili dengan field: Negara Provinsi Kota/Kabupaten Kecamatan Kelurahan Kode Pos Alamat Lengkap URL Google Maps Simpan Batalkan / Close
Given user sudah mengisi alamat, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Kelola Pengguna
Given user berada di modal Edit Alamat Domisili,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak disimpan, section Alamat Domisili tetap menampilkan data sebelumnya.
✅ Case: Lihat Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar prestasi yang pernah saya raih di tab Detail Profil, sehingga saya bisa memantau dan menampilkan pencapaian saya secara lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar prestasi user dengan informasi setiap item: Nama Penghargaan / Prestasi Nama Lembaga / Ajang Penyelenggara Tahun Penerimaan
Given user belum memiliki data prestasi,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data prestasi”).
Given tab prestasi terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan prestasi yang pernah saya raih melalui modal, sehingga daftar pencapaian saya tercatat lengkap dan akurat.	Given user sudah login dan berada di section Prestasi, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Prestasi dengan field: Nama Prestasi / Penghargaan Nama Penyelenggara / Lembaga Tahun Penerimaan Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Prestasi "Prestasi berhasil ditambahkan"
Given user berada di modal Tambah Prestasi,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Prestasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data prestasi yang sudah tercatat, sehingga daftar pencapaian saya selalu akurat dan up-to-date.	Given user sudah login dan memiliki data prestasi, When user klik tombol Ubah di section Prestasi, Then sistem menampilkan modal daftar prestasi dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Prestasi "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Prestasi "Data berhasil dihapus"
Given Then
✅ Case: Lihat Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin melihat daftar pelatihan dan sertifikasi yang pernah saya ikuti di tab Detail Profil, sehingga saya bisa memantau dan menampilkan riwayat pengembangan profesional saya secara lengkap.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar pelatihan & sertifikasi user dengan informasi setiap item: Nama Pelatihan / Sertifikasi Periode Pelatihan Nama Penyelenggara Tipe Pelaksanaan Lokasi Pelatihan Deskripsi Ringkas URL Credential
Given user belum memiliki data pelatihan & sertifikasi,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data pelatihan & sertifikasi”).
Given tab pelatihan & sertifikasi terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan data pelatihan dan sertifikasi melalui modal, sehingga riwayat pengembangan profesional saya tercatat lengkap dan dapat ditampilkan di profil maupun tab sertifikat.	Given user sudah login dan berada di section Pelatihan & Sertifikasi, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Pelatihan & Sertifikasi dengan field: Nama Pelatihan / Sertifikasi Nama Penyelenggara Periode Mulai & Akhir Tipe Pelaksanaan Lokasi Deskripsi URL Credential Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Pelatihan & Sertifikasi "Pelatihan/sertifikasi berhasil ditambahkan" Sertifikat
Given user berada di modal Tambah Pelatihan & Sertifikasi,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Pelatihan & Sertifikasi	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data pelatihan dan sertifikasi yang sudah tercatat, sehingga riwayat pengembangan profesional saya selalu akurat dan up-to-date di profil maupun tab sertifikat.	Given user sudah login dan memiliki data pelatihan/sertifikasi, When user klik tombol Ubah di section Pelatihan & Sertifikasi, Then sistem menampilkan modal daftar pelatihan/sertifikasi dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Pelatihan & Sertifikasi "Perubahan berhasil disimpan" Sertifikat
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Pelatihan & Sertifikasi "Data berhasil dihapus" Sertifikat
Given Then
✅ Case: Lihat Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat daftar bahasa yang saya kuasai di tab Detail Profil, sehingga saya bisa menampilkan kemampuan bahasa saya secara lengkap dan mudah diakses.	Given user sudah login, When user membuka tab Detail Profil, Then sistem menampilkan daftar bahasa yang dikuasai user dengan informasi setiap item: Nama Bahasa Tingkat Kemahiran
Given user belum memiliki data bahasa,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada data bahasa”).
Given tab bahasa terbuka, Then sistem menampilkan: Icon Tambah (+) Icon Edit (Pensil)
✅ Case: Tambah Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan bahasa yang saya kuasai beserta tingkat kemahirannya, sehingga daftar kemampuan bahasa saya tercatat lengkap dan dapat ditampilkan di profil.	Given user sudah login dan berada di section Bahasa, When user klik tombol Tambah (+), Then sistem menampilkan form Tambah Bahasa dengan field: Nama Bahasa Tingkat Kemahiran Simpan Batalkan / Close
Given user telah mengisi field, When user klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given Then sistem: Bahasa "Bahasa berhasil ditambahkan"
Given user berada di modal Tambah Bahasa,When user klik tombol Batalkan / Close,Then modal tertutup dan data tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Ubah/Hapus Bahasa	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat mengubah atau menghapus data bahasa yang saya kuasai, sehingga daftar kemampuan bahasa saya selalu akurat dan up-to-date di profil.	Given user sudah login dan memiliki data bahasa, When user klik tombol Ubah di section Bahasa, Then sistem menampilkan modal daftar bahasa dengan detail setiap item: Ubah Hapus
Given user memilih opsi Ubah pada salah satu item, When user melakukan perubahan dan klik tombol Simpan, Then sistem melakukan validasi field mandatory:
Given validasi berhasil, Then sistem: Bahasa "Perubahan berhasil disimpan"
Given user memilih opsi Hapus pada salah satu item,When user klik tombol Hapus,Then sistem menampilkan pop-up konfirmasi penghapusan
Given user mengkonfirmasi penghapusan, Then sistem: Bahasa "Data berhasil dihapus"
Given Then
✅ Case: Lihat Keahlian	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat daftar keahlian saya dalam bentuk tag di tab Detail Profil, sehingga saya bisa menampilkan kemampuan profesional saya secara ringkas dan mudah dibaca.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan daftar keahlian dalam bentuk tag/chip dengan urutan sesuai input user (tidak ada sorting otomatis).
Given user belum memiliki data keahlian,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada keahlian yang ditambahkan”) dan tombol Tambah muncul
Given user sudah memiliki minimal 1 keahlian,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengakses modal edit keahlian.
Given user berada di section Keahlian,Then sistem menampilkan tombol Tambah / Ubah sesuai kondisi data keahlian.
When user klik tombol tersebut,Then sistem membuka modal untuk menambah atau mengubah keahlian (detail modal bisa dibuat di case Tambah/Ubah Keahlian berikutnya).
✅ Case: Ubah Keahlian	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus keahlian yang saya kuasai, sehingga daftar keahlian saya selalu akurat dan up-to-date di profil.	Given user sudah login dan memiliki data keahlian, When user klik tombol Ubah di section Keahlian, Then sistem menampilkan modal Edit Keahlian dengan fitur: tag input menambah tag baru menghapus tag mengubah tag 10 keahlian Simpan Batalkan / Close
Given user telah mengubah keahlian sesuai kebutuhan, When user klik tombol Simpan, Then sistem melakukan validasi:
Given validasi berhasil, Then sistem: Keahlian "Keahlian berhasil diperbarui
Given user berada di modal Edit Keahlian,When user klik tombol Batalkan / Close,Then modal tertutup dan perubahan tidak tersimpan, section tetap menampilkan data sebelumnya.
✅ Case: Lihat Media Sosial	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat melihat URL media sosial saya di tab Detail Profil, sehingga saya bisa mengakses atau membagikan akun media sosial dengan mudah.	Given user sudah login,When user membuka tab Detail Profil,Then sistem menampilkan URL media sosial user jika sudah diunggah, dengan link yang dapat diklik dan terbuka di tab baru
Given user belum menambahkan media sosial,Then sistem menampilkan empty state dengan pesan yang sesuai (misal: “Belum ada media sosial yang ditambahkan”) dan tombol Tambah muncul.
Given user sudah menambahkan media sosial sebelumnya,Then tombol Tambah berubah menjadi tombol Ubah, untuk mengganti atau memperbarui link media sosial.
Given link media sosial tersedia,When user klik link media sosial,Then link akan terbuka di tab baru browser sesuai URL yang diberikan.
✅ Case: Tambah/Ubah Media Sosial	Sebagai seorang pengguna platform yang sudah login, saya ingin dapat menambahkan, mengubah, atau menghapus link media sosial saya, sehingga informasi media sosial yang tampil di profil selalu akurat dan dapat diakses dengan mudah.	Given user sudah login, When user klik tombol Tambah / Ubah di section Media Sosial, Then sistem menampilkan modal Edit Media Sosial dengan fitur: Jenis Media Sosial URL situs Simpan Batalkan / Close Hapus link
Given user mengisi atau mengubah URL media sosial dan klik tombol Simpan,Then sistem melakukan validasi format URL.
Given Then sistem: Media Sosial "Media Sosial berhasil diperbarui"
Given user klik tombol Hapus link di modal edit media sosial,Then sistem menampilkan konfirmasi penghapusan.
Given user konfirmasi,Then sistem menghapus link media sosial, section menampilkan empty state, dan tombol Tambah muncul kembali.
Given user klik Batalkan / Close,Then modal tertutup tanpa perubahan, link media sosial tetap tersimpa
❌ Negative Case	Sebagai seorang pengguna platform, saya ingin melihat indikasi yang jelas ketika data profil tidak tersedia atau gagal dimuat, sehingga saya tahu bahwa data kosong atau terjadi kesalahan, dan dapat mengambil tindakan yang sesuai.	Given user membuka tab Detail Profil,When salah satu section (misal: Pendidikan, Pengalaman Kerja, Keahlian, Media Sosial, dll) tidak memiliki data,Then sistem menampilkan empty state di section tersebut dengan pesan informatif (contoh: “Belum ada data yang ditambahkan”)
Then tombol Tambah muncul untuk memungkinkan user menambahkan data baru.
Given user membuka tab Detail Profil, When sistem gagal memuat data dari server atau terjadi error jaringan, Then sistem menampilkan Error State di seluruh halaman dengan: "Terjadi kesalahan saat memuat data." Muat Ulang Overview
Given user klik tombol Muat Ulang,Then sistem memulai ulang proses loading data.
Given data berhasil dimuat setelah refresh,Then error state hilang, dan seluruh section menampilkan data sesuai ketersediaan
✅ Case: Lihat Overview	Sebagai pengguna platform yang sudah login, saya ingin melihat tab Overview di halaman profil saya, sehingga saya bisa mendapatkan ringkasan cepat dari portofolio, sertifikat, hasil belajar, hasil asesmen, dan aktivitas saya.	Given user sudah login, When user membuka tab Overview pada halaman User Profile, Then sistem menampilkan section utama secara berurutan: Then setiap section menampilkan maksimal 2 card terbaru dari data yang ada di tab asalnya. Then setiap card menampilkan informasi dan bentuk tampilan yang sama persis dengan tab asal.
Given user melihat card pada Overview,When user klik salah satu card,Then sistem mengarahkan user ke halaman detail card tersebut (tab asal).
Given setiap section menampilkan ikon gembok (privacy),When user klik ikon gembok,Then sistem mengarahkan user ke halaman pengaturan akun privasi profil spesifik pada section tersebut (open new tab)
Given user berada pada header section,When user klik ikon gembok,Then sistem menampilkan Modal Ubah Privasi Section untuk section tersebut.
Given user melihat header section,When user klik tombol “Lihat Semua”,Then sistem mengarahkan user ke tab asal section (misal: Portofolio → Tab Portofolio).
Given suatu section tidak memiliki data,Then sistem menampilkan empty state di section tersebut dengan pesan yang sesuai (contoh: “Belum ada data di section ini”).
✅ Case: Lihat Portofolio	Sebagai pengguna platform yang sudah login, saya ingin membuka tab Portfolio untuk melihat seluruh portofolio saya, baik yang diunggah otomatis melalui aktivitas maupun manual, sehingga saya dapat meninjau dan mengelola karya saya dengan mudah.	Given user login dan memiliki minimal satu portofolio (otomatis atau manual), When user klik tab Portfolio, Then sistem menampilkan daftar portofolio user yang terdiri dari: Portofolio Otomatis Portofolio Manual Then setiap card portofolio menampilkan: Background portofolio Tag Tahun Ajaran (TA) Nama portofolio Tagging “Platform” atau “Lainnya”: Tagging status privasi “Publik” atau “Privat”:
Given When Then halaman detail portofolio Then button Pin
Then terbaru → terlama (newest → oldest) Then 10 card portofolio Then pagination
✅ Case: Cari Portofolio	Sebagai pengguna platform, saya ingin mencari portofolio berdasarkan nama melalui kolom pencarian, sehingga saya dapat menemukan portofolio tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar portofolio, Then sistem menampilkan search bar dengan:
Given user mengetik nama portofolio pada kolom pencarian,When user selesai memasukkan kata kuncinya,Then sistem memproses pencarian berdasarkan case-insensitive partial match. Then selama proses pencarian: loading indicator
Then setelah hasil diterima: ascending berdasarkan nama relevansi kecocokan Then jika user menghapus teks pencarian → tampilkan kembali daftar portofolio default (seluruh portofolio terbaru).
✅ Case: Filter Portofolio	Sebagai pengguna platform, saya ingin memfilter portofolio berdasarkan akses profil, sumber, dan tahun ajaran, sehingga saya dapat menampilkan portofolio yang relevan sesuai kriteria yang saya inginkan.	Given user berada di halaman Portofolio, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Portofolio dengan opsi: Akses Profil: Sumber: Tahun Ajaran: Close (X) Reset Terapkan Filter
Given user mengklik tombol Close (X) pada modal filter,Then modal tertutup dan tidak ada perubahan pada daftar portofolio di halaman utama.
Given user mengklik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal/default
Given user memilih satu atau beberapa opsi filter,When user mengklik tombol Terapkan Filter,Then modal tertutup dan daftar portofolio di halaman utama diperbarui sesuai kriteria filter yang dipilih.Then hasil filter diterapkan secara real-time pada tampilan list portofolio.
✅ Case: Pin Portofolio	Sebagai pengguna, saya ingin dapat mem-pin portofolio favorit saya sehingga card tersebut selalu muncul di posisi paling atas daftar portofolio untuk memudahkan akses cepat.	Given user sudah login dan membuka tab Portofolio,When user melihat daftar card portofolio,Then setiap card menampilkan icon Pin di card header
Given card belum dipin (icon Pin abu-abu),When user mengklik icon Pin,Then status card menjadi pinned (icon Pin berubah biru) dan card berpindah ke posisi paling atas kiri daftar portofolio.
Given card sudah dipin (icon Pin biru),When user mengklik icon Pin kembali,Then status pinned dilepaskan (icon Pin kembali abu-abu) dan card kembali ke posisi normal berdasarkan urutan waktu (newest → oldest).
✅ Case: Navigasi Pagination	Sebagai pengguna, saya ingin dapat berpindah antar halaman portofolio sehingga saya bisa melihat seluruh daftar portofolio meskipun jumlahnya lebih dari satu halaman.	Given user membuka tab Portofolio dan memiliki lebih dari 10 portofolio,Then sistem menampilkan tombol pagination di bagian bawah daftar portofolio dengan label halaman (1, 2, 3, …).
Given user memiliki ≤ 10 portofolio,Then pagination tidak ditampilkan.
Given user klik tombol pagination (misal: Halaman 2),Then sistem menampilkan maksimal 10 card portofolio sesuai halaman yang dipilih. Urutan portofolio tetap newest → oldest secara global, tidak berubah berdasarkan halaman.
✅ Case: Lihat Detail Portofolio (Otomatis)	Sebagai pengguna, saya ingin melihat halaman detail portofolio sehingga saya dapat melihat informasi lengkap portofolio yang saya unggah atau yang dihasilkan dari aktivitas/program.	Given user sudah login, memiliki minimal satu portofolio, dan berada di tab Portfolio,When user klik salah satu card portofolio,Then sistem menampilkan halaman detail portofolio yang dipilih.
✅ Case: Lihat Detail Portofolio (Manual)	Sebagai pengguna, saya ingin melihat halaman detail portofolio yang saya unggah secara manual sehingga saya dapat meninjau informasi lengkap dan konten portofolio saya.	Given user sudah login, memiliki minimal satu portofolio manual, dan berada di tab Portfolio,When user klik salah satu card portofolio,Then sistem menampilkan halaman detail portofolio yang dipilih.
✅ Case: Tambah Portofolio (Manual)	Sebagai pengguna, saya ingin menambahkan portofolio baru secara manual melalui halaman Portfolio, agar saya dapat menyimpan dan menampilkan hasil karya atau dokumen saya secara lengkap.	Given user sudah login dan berada di tab Portfolio, When user klik tombol Tambah Portofolio, Then sistem menampilkan modal Tambah Portofolio dengan field:
When Simpan Perubahan Then Jika valid: “Portofolio berhasil ditambahkan.” Card portofolio menampilkan preview konten dalam bentuk grid card berdasarkan jenis file, meliputi:
When user klik tombol Batalkan,Then modal ditutup tanpa menyimpan perubahan apa pun.
✅ Case: Ubah Portofolio (Otomatis)	Sebagai pengguna, saya ingin dapat memperbarui refleksi pada portofolio otomatis yang dihasilkan dari aktivitas platform, agar saya bisa menambahkan catatan pribadi atau insight terkait portofolio tersebut tanpa mengubah data portofolio lainnya.	Given user sudah login dan berada di halaman detail portofolio otomatis,When user klik tombol/ikon Edit/Ubah,Then sistem menampilkan form Ubah Portofolio Otomatis.
When Simpan Then Refleksi “Refleksi berhasil diperbarui.” Detail Portofolio
When user klik tombol Batalkan,Then sistem membatalkan proses edit dan mengembalikan user ke halaman detail portofolio tanpa menyimpan perubahan apa pun.
✅ Case: Ubah Portofolio (Manual)	Sebagai pengguna, saya ingin dapat mengubah portofolio yang pernah saya buat secara manual, agar saya bisa memperbarui judul, deskripsi, kompetensi, hasil karya, atau pengaturan privasi sesuai kebutuhan saya.	Given user sudah login dan berada di halaman detail portofolio manual,When user klik tombol/ikon Edit/Ubah,Then sistem menampilkan form Ubah Portofolio Manual dengan semua field terisi sesuai data portofolio sebelumnya.
When Simpan Then “Perubahan portofolio berhasil disimpan.” Detail Portofolio
When user klik tombol Batalkan,Then sistem membatalkan proses edit dan mengembalikan user ke halaman detail portofolio tanpa menyimpan perubahan.
✅ Case: Ubah Detail Dokumen Portofolio (Manual & Otomatis)	Sebagai pengguna, saya ingin dapat mengubah informasi file hasil karya di portofolio saya (manual maupun otomatis), agar saya bisa memperbarui judul, refleksi, atau menjadikannya cover card sesuai kebutuhan.	Given user sudah login dan berada di halaman Detail Portofolio Manual/Otomatis, And portofolio memiliki minimal satu hasil karya, When user klik salah satu card hasil karya, Then sistem menampilkan Modal Informasi File dengan:
When user klik ikon Edit/Pensil di bagian Informasi File, Then field diubah menjadi mode edit: Judul File Refleksi Jadikan Sebagai Cover Card
When user klik tombol Simpan, Then sistem: “Informasi file berhasil diperbarui”
When Batalkan Then When X Then
❌ Negative Case	As a user I want melihat empty state di tab Portofolio So that saya tahu belum ada portofolio dan bisa menambahkan portofolio baru Acceptance Criteria / UAC:	Given user berada di halaman User ProfileWhen user membuka tab PortfolioThen sistem menampilkan empty state di tab Portofolio.
Given Then CTA “Tambah Portofolio”
As a user I want melihat error state ketika tab Portofolio gagal dimuatSo that saya dapat memahami ada kesalahan dan mencoba memuat ulang konten	Given user berada di halaman User Profile When user klik tab Portfolio dan terjadi error pada loading data Then sistem menampilkan error state dengan deskripsi: "Terjadi kesalahan saat memuat konten."
Given error state ditampilkanThen terdapat tombol “Muat Ulang Konten” yang dapat diklik.
Given user klik tombol “Muat Ulang Konten”Then sistem melakukan refresh pada tab Portofolio dan mencoba memuat data kembali.
✅ Lihat Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin melihat tab Sertifikat pada halaman profil saya, Sehingga saya dapat meninjau seluruh sertifikat yang saya miliki baik dari aktivitas di platform maupun yang saya unggah secara manual, dalam urutan terbaru ke terlama, dengan tampilan yang rapi dan mudah diakses.	Given user sudah login dan berada di halaman profil,When user memilih tab Sertifikat,Then sistem menampilkan daftar sertifikat milik user dalam bentuk card.
Given tab Sertifikat terbuka,When sistem menampilkan daftar sertifikat,Then hanya sertifikat dari program yang mengaktifkan toggle sertifikat di admin yang ditampilkan di tab ini.
Given tab Sertifikat terbuka,When sistem menampilkan daftar sertifikat,Then urutan sertifikat adalah dari yang terbaru ke yang terlama (newest to oldest).
Given jumlah sertifikat ≤ 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan semua sertifikat dalam satu halaman tanpa pagination.
Given jumlah sertifikat > 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan pagination dengan maksimal 12 card per halaman
Given sistem menampilkan daftar sertifikat, When setiap card ditampilkan, Then card berisi: “Platform” “Lainnya” Tahun Ajaran “Publik” “Privat” pin pensil
Given user melihat daftar sertifikat, When user mengklik salah satu card sertifikat, Then: platform (tribe 3) halaman detail sertifikat secara manual oleh user URL sertifikat
✅ Tambah Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat menambahkan sertifikat baru melalui tab Sertifikat di halaman profil saya, Sehingga saya dapat memperbarui portofolio saya dengan pelatihan atau sertifikasi terbaru yang saya ikuti, baik secara daring maupun luring.	Given user sudah login dan berada di halaman profil,When user membuka tab Sertifikat,Then sistem menampilkan tombol “Tambah Sertifikat”.
Given user mengklik tombol “Tambah Sertifikat”, When aksi dikonfirmasi, Then sistem menampilkan modal Tambah Sertifikat dengan field berikut: Jenis Pelatihan Sertifikasi Nama Pelatihan atau Sertifikasi Institusi Penyelenggara Tipe Penyelenggaraan Luring Daring Lokasi Penyelenggara Tipe = Luring Tanggal Mulai Tanggal Selesai checkbox Checkbox “Hanya berlangsung satu hari” Tautan Sertifikat
Given modal Tambah Sertifikat terbuka, When user mengisi data, Then sistem melakukan validasi real-time: Tautan Sertifikat Tanggal Selesai Tanggal Mulai
Given user telah mengisi semua field, When user menekan tombol “Simpan Perubahan”, Then sistem: valid tidak valid
Given proses penambahan sertifikat berhasil,When sistem menampilkan halaman tab Sertifikat,Then sertifikat baru langsung muncul di daftar sertifikat user (urutan sesuai newest to oldest) dan juga muncul di halaman detail profil user.
Given modal Tambah Sertifikat terbuka,When user menekan tombol “Batalkan”,Then sistem menutup modal tanpa menyimpan perubahan apa pun.
✅ Ubah Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat mengubah data sertifikat yang telah saya tambahkan sebelumnya melalui tab Sertifikat, Sehingga saya dapat memperbarui informasi sertifikat yang mungkin mengalami perubahan, seperti tanggal, nama pelatihan, atau tautan sertifikat.	Given user sudah login dan berada di halaman profil,When user membuka tab Sertifikat,Then sistem menampilkan daftar sertifikat dengan ikon pensil (✏️) pada setiap card untuk mengubah data.
Given terdapat minimal satu sertifikat yang sudah pernah ditambahkan, When user mengklik ikon pensil (✏️) pada salah satu card sertifikat, Then sistem menampilkan modal Ubah Sertifikat (UI sama seperti modal Tambah Sertifikat) dengan seluruh field otomatis terisi sesuai data lama: Jenis Pelatihan Sertifikasi Nama Pelatihan atau Sertifikasi Institusi Penyelenggara Tipe Penyelenggaraan Luring Daring Lokasi Penyelenggara Tipe = Luring Tanggal Mulai Tanggal Selesai checkbox “Hanya berlangsung satu hari” Checkbox “Hanya berlangsung satu hari” Tautan Sertifikat (opsional)
Given modal Ubah Sertifikat terbuka, When user mengubah satu atau beberapa field, Then sistem melakukan validasi real-time: Tautan Sertifikat Tanggal Selesai Tanggal Mulai
Given user telah melakukan perubahan data, When user menekan tombol “Simpan Perubahan”, Then sistem: valid Sertifikat profil user tidak valid
Given modal Ubah Sertifikat terbuka,When user menekan tombol “Batalkan”,Then sistem menutup modal tanpa menyimpan perubahan apa pun.
✅ Cari Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat mencari sertifikat berdasarkan nama melalui kolom pencarian, Sehingga saya dapat dengan cepat menemukan sertifikat tertentu tanpa harus menelusuri seluruh daftar sertifikat secara manual.	Given user sudah login dan berada di halaman tab Sertifikat, When halaman terbuka, Then sistem menampilkan kolom pencarian (search bar) dengan:
Given kolom pencarian tersedia,When user mengetikkan teks di kolom pencarian,Then sistem menunggu selama 300–500ms (debounce time) sebelum memproses pencarian untuk menghindari pemanggilan API berulang.
Given user telah mengetikkan kata kunci di kolom pencarian,When user selesai memasukkan kata kuncinya di kolom pencarian,Then sistem memulai proses pencarian dan menampilkan loading indicator (misalnya spinner atau skeleton UI) selama data sedang dimuat.
Given sistem sedang memproses pencarian, When hasil ditemukan, Then sistem menampilkan daftar sertifikat yang nama/judulnya mengandung kata kunci pencarian (case-insensitive partial match), dengan urutan: abjad (ascending by name) relevansi kecocokan nama
Given sistem telah memproses pencarian, When tidak ditemukan sertifikat yang cocok, Then sistem menampilkan pesan: “Tidak ada sertifikat dengan nama tersebut.
Given user telah melakukan pencarian,When user menghapus teks dari kolom pencarian,Then sistem menampilkan kembali seluruh daftar sertifikat dalam default state (urutan terbaru ke terlama)
Given kolom pencarian tersedia,When user menggunakan perangkat mobile maupun desktop,Then tampilan kolom pencarian harus responsif dan tetap mudah diakses pada kedua mode tampilan tersebut
Given kolom pencarian aktif,When user selesai memasukkan kata kuncinya,Then sistem mengeksekusi fungsi pencarian (aksesibilitas keyboard-friendly)
Case: ✅ Filter Sertifikat	Sebagai seorang pengguna yang sudah login, Saya ingin dapat memfilter daftar sertifikat berdasarkan kriteria tertentu seperti status privasi, sumber, dan tahun ajaran, Sehingga saya dapat dengan mudah menampilkan sertifikat yang relevan dengan kebutuhan saya tanpa harus menelusuri seluruh daftar sertifikat.	Given user sudah login dan berada di halaman Sertifikat,When user mengklik tombol “Filter”,Then sistem menampilkan Modal Filter Sertifikat
Given modal Filter Sertifikat terbuka, When modal ditampilkan, Then sistem menampilkan tiga kategori filter berikut: Akses Profil Publik Privat Sumber Platform Lainnya Platform Lainnya Tahun Ajaran
Given modal Filter Sertifikat terbuka,When user mengklik tombol “X (Close)” di pojok kanan atas,Then modal tertutup tanpa menerapkan perubahan filter.
Given user telah memilih beberapa filter,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given user telah memilih satu atau beberapa opsi filter, When user menekan tombol “Terapkan Filter” di bagian bawah kanan modal, Then sistem: kriteria filter yang dipilih
Given filter telah diterapkan,When user melihat daftar sertifikat,Then hanya sertifikat yang memenuhi semua kriteria filter yang ditampilkan di daftar utama.
✅ Case: Pin Sertifikat	As a user,I want to pin up to 4 certificates in my portfolio,so that I can easily highlight and access my most important certificates at the top of the list.	Given user sudah login dan melihat daftar sertifikat di tab Portofolio,When user mengklik ikon Pin pada card sertifikat yang belum dipin,Then ikon berubah dari abu-abu menjadi biru dan card tersebut berpindah ke posisi paling atas kiri pada daftar portofolio.
Given user sudah login dan terdapat card yang sudah dipin (ikon biru),When user mengklik kembali ikon Pin pada card tersebut,Then ikon kembali menjadi abu-abu dan card berpindah ke posisi semula berdasarkan urutan waktu (newest → oldest).
Given user memiliki beberapa sertifikat,When user mem-pin satu atau lebih sertifikat,Then semua sertifikat yang dipin ditampilkan di baris paling atas, dari kiri ke kanan sesuai urutan pin terbaru ke terlama.
Given user sudah mem-pin beberapa sertifikat,When user melakukan pin pada sertifikat baru,Then card baru tersebut akan muncul di posisi paling kiri, dan card pinned sebelumnya bergeser ke kanan.
Given user sudah memiliki 4 sertifikat yang dipin,When user mencoba mem-pin sertifikat lain,Then ikon Pin pada sertifikat lain akan menjadi disabled (tidak dapat diklik).
And saat user hover pada ikon Pin yang disabled, Then sistem dapat menampilkan tooltip bertuliskan: “Maksimal pin adalah 4 sertifikat.”
Given When Then And Then
Given When Then secara langsung (real-time) And
✅ Case: Lihat Rapor	As a logged-in user,I want to view my list of report cards (rapor) in the Hasil Belajar tab,so that I can easily access and open detailed information about each report card.	Given user sudah login dan berada di tab Hasil Belajar,When user memilih atau membuka section Rapor,Then sistem menampilkan daftar rapor milik user.
Given terdapat beberapa rapor yang dimiliki user,When daftar rapor ditampilkan,Then sistem mengurutkan rapor berdasarkan waktu pembuatan dari newest to oldest.
And setiap halaman menampilkan maksimal 12 card rapor.If jumlah rapor > 12,Then sistem menampilkan pagination di bagian bawah daftar (misalnya: 1, 2, 3...).
Given When Then halaman detail rapor tab baru (new tab) And [Tribe 3 - halaman detail rapor]
Given When Then And loading skeleton feedback visual
✅ Case: Cari Rapor	As a logged-in user,I want to search for my report cards (rapor) by name,so that I can quickly find specific rapor without scrolling through the entire list.	Given user sudah login dan berada di halaman daftar Rapor, When halaman dimuat, Then sistem menampilkan search bar di bagian atas dengan: "Cari rapor"
Given When Then And case-insensitive partial match (contoh: mengetik “ux” akan menemukan “UX Design Rapor”)
When Then loading indicator Then Jika ditemukan, tampilkan daftar rapor sesuai: ascending by name
Given user telah melakukan pencarian,When user menghapus teks di kolom pencarian,Then sistem menampilkan kembali daftar rapor default (semua rapor terbaru berdasarkan urutan waktu: newest → oldest).
Case: ✅ Filter Rapor	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Rapor di halaman Rapor, Sehingga saya dapat memfilter daftar Rapor berdasarkan status privasi dan tahun ajaran, agar daftar Rapor yang ditampilkan sesuai dengan kebutuhan saya dan lebih mudah dicari.	Given user berada di halaman Rapor dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Rapor.
Given Modal Filter Rapor terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Rapor terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select): User dapat memilih satu atau beberapa tahun ajaran untuk mempersempit hasil Rapor.
Given Modal Filter Rapor terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Rapor terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Rapor terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Rapor yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list Rapor halaman utama.
Case: ✅ Lihat Laporan Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin membuka section Laporan Belajar di tab Laporan Belajar, Sehingga saya dapat melihat daftar seluruh laporan belajar saya dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail laporan jika diperlukan.	Given user sudah login,When user masuk ke section Laporan Belajar,Then sistem menampilkan daftar Laporan Belajar.
Given daftar Laporan Belajar ditampilkan,When sistem menampilkan laporan,Then urutan laporan adalah dari newest ke oldest
Given jumlah laporan ≤ 12,When sistem menampilkan daftar Laporan Belajar,Then semua laporan ditampilkan dalam satu halaman tanpa pagination.
Given jumlah laporan > 12,When sistem menampilkan daftar Laporan Belajar,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given sistem menampilkan daftar laporan belajar, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar laporan belajar,When user mengklik salah satu card laporan belajar,Then sistem membuka halaman detail laporan belajar di tab baru (tribe 3)
Case: ✅ Cari Laporan Hasil Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin mencari laporan hasil belajar berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar laporan.	Given user sudah login dan berada di halaman daftar laporan hasil belajar,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari laporan hasil belajar” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama laporan hasil belajar,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar laporan hasil belajar yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada laporan hasil belajar dengan nama tersebut.”
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar laporan hasil belajar (default state).
Case: ✅ Filter Laporan Hasil Belajar	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Hasil Belajar di halaman Laporan Hasil Belajar, Sehingga saya dapat memfilter daftar laporan berdasarkan status privasi dan tahun ajaran, agar daftar laporan yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Hasil Belajar dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Belajar.
Given Modal Filter Laporan Hasil Belajar terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Hasil Belajar terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select): User dapat memilih satu atau beberapa tahun ajaran untuk mempersempit hasil laporan.
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Hasil Belajar terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Hasil Belajar yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list laporan halaman utama.
✅ Lihat Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin membuka section Laporan Perkembangan Murid di tab Hasil Belajar, Sehingga saya dapat melihat seluruh laporan perkembangan murid dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail laporan jika diperlukan.	Given user sudah login,When user masuk ke section Laporan Perkembangan Murid,Then sistem menampilkan daftar Laporan Perkembangan Murid.
Given daftar Laporan Perkembangan Murid ditampilkan,When sistem menampilkan laporan,Then urutan laporan adalah dari newest ke oldest.
Given jumlah laporan ≤ 12,When sistem menampilkan daftar laporan,Then semua laporan ditampilkan dalam satu halaman tanpa pagination.
Given jumlah laporan > 12,When sistem menampilkan daftar laporan,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given sistem menampilkan daftar laporan, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar laporan,When user mengklik salah satu card laporan perkembangan murid,Then sistem membuka halaman detail laporan perkembangan murid di tab baru (tribe 3).
Case: ✅ Cari Laporan Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin mencari laporan perkembangan murid berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar laporan.	Given user sudah login dan berada di halaman daftar laporan perkembangan murid,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari laporan perkembangan murid” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama laporan perkembangan murid,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar laporan perkembangan murid yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada laporan perkembangan murid dengan nama tersebut.”
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar laporan perkembangan murid (default state).
Case: ✅ Filter Laporan Perkembangan Murid	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Perkembangan Murid di halaman Laporan Perkembangan Murid, Sehingga saya dapat memfilter daftar laporan berdasarkan status privasi dan tahun ajaran, agar daftar laporan yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Perkembangan Murid dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Perkembangan Murid.
Given Modal Filter Laporan Perkembangan Murid terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Perkembangan Murid terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select):
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter.
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Perkembangan Murid terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Perkembangan Murid yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list laporan halaman utama.
Case: ✅ Navigasi Pagination	Sebagai seorang pengguna yang sudah login, Saya ingin berpindah halaman daftar rapor, laporan hasil belajar, atau laporan perkembangan murid ketika jumlah item lebih dari 12, Sehingga saya dapat melihat semua data secara bertahap tanpa kehilangan urutan terbaru ke terlama.	Given user memiliki lebih dari 12 rapor/laporan hasil belajar/laporan perkembangan murid,When daftar ditampilkan,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given user melihat pagination,When user mengklik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 12 card sesuai halaman yang dipilih.
Given user berpindah halaman,When daftar ditampilkan,Then urutan tetap newest → oldest secara global di seluruh halaman.
Case: ❌ Halaman Gagal Diload	Sebagai seorang pengguna yang sudah login, Saya ingin mendapatkan informasi jika halaman atau section gagal dimuat, Sehingga saya tahu bahwa terjadi kesalahan dan dapat mencoba memuat ulang konten.	Given halaman atau section gagal diload karena kesalahan sistem atau jaringan, When user membuka halaman atau section tersebut, Then sistem menampilkan state error dengan:
Given state error ditampilkan,When user mengklik tombol “Muat Ulang Konten”,Then sistem mencoba memuat ulang halaman atau section tersebut (refresh).
Case: ✅ Lihat Hasil Assessment	Sebagai seorang pengguna yang memiliki minimal satu hasil assessment, Saya ingin membuka tab Laporan Hasil Assessment, Sehingga saya dapat melihat seluruh hasil assessment saya dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta mengakses halaman detail assessment jika diperlukan.	Given user memiliki minimal satu hasil assessment,When user mengklik tab Laporan Hasil Assessment,Then sistem menampilkan semua hasil assessment di tab tersebut.
Given daftar hasil assessment ditampilkan,When sistem menampilkan laporan,Then urutan card adalah newest → oldest.
Given jumlah hasil assessment ≤ 12,When sistem menampilkan daftar,Then semua hasil assessment ditampilkan dalam satu section tanpa pagination.
Given jumlah hasil assessment > 12,When sistem menampilkan daftar,Then sistem menampilkan pagination (10 card per halaman).
Given sistem menampilkan daftar hasil assessment, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar hasil assessment,When user mengklik salah satu card,Then sistem membuka halaman detail assessment di tab baru (tribe 3).
Case: ✅ Cari Laporan Hasil Assessment	Sebagai seorang pengguna yang sudah login, Saya ingin mencari Laporan Hasil Assessment berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan hasil assessment tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user sudah login dan berada di halaman daftar Laporan Hasil Assessment,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari Laporan Hasil Assessment” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama Laporan Hasil Assessment,Then sistem memproses pencarian
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When laporan ditemukan,Then sistem menampilkan daftar Laporan Hasil Assessment yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada laporan yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada Laporan Hasil Assessment dengan nama tersebut.
Given user menghapus teks pencarian,When search bar kosong,Then sistem menampilkan kembali seluruh daftar Laporan Hasil Assessment (default state).
✅ Filter Laporan Hasil Assessment	Sebagai seorang pengguna yang sudah login, Saya ingin membuka modal Filter Laporan Hasil Assessment di halaman Laporan Hasil Assessment, Sehingga saya dapat memfilter daftar hasil assessment berdasarkan status privasi dan tahun ajaran, agar daftar yang ditampilkan sesuai dengan kriteria yang saya pilih.	Given user berada di halaman Laporan Hasil Assessment dan sudah login,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Assessment.
Given Modal Filter Laporan Hasil Assessment terbuka, When user melihat opsi Akses Profil, Then sistem menampilkan opsi:
Given Modal Filter Laporan Hasil Assessment terbuka, When user melihat opsi Tahun Ajaran, Then sistem menampilkan daftar tahun ajaran (multi-select):
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “X” di pojok kanan atas modal,Then modal akan tertutup tanpa menerapkan perubahan filter
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “Reset” di bagian bawah kiri modal,Then semua pilihan filter akan dikosongkan dan kembali ke kondisi awal (default).
Given Modal Filter Laporan Hasil Assessment terbuka,When user mengklik tombol “Terapkan Filter” di bagian bawah kanan modal,Then sistem akan menutup modal dan menampilkan daftar Laporan Hasil Assessment yang sesuai dengan kriteria filter yang dipilih, langsung diterapkan di tampilan list halaman utama.
Case: ✅ Navigasi Pagination Portfolio	Sebagai seorang pengguna yang memiliki lebih dari 10 portofolio, Saya ingin berpindah halaman daftar portofolio, Sehingga saya dapat melihat seluruh portofolio secara bertahap tanpa kehilangan urutan terbaru ke terlama.	Given user memiliki lebih dari 10 portofolio,When daftar portofolio ditampilkan,Then sistem menampilkan pagination dengan maksimal 10 card per halaman.
Given user melihat pagination,When user mengklik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 10 card sesuai halaman yang dipilih
Given user berpindah halaman,When daftar ditampilkan,Then urutan card tetap newest → oldest secara global.
Case: ❌ Negative Case – Halaman Tab Laporan Hasil Assessment Gagal Diload	Sebagai seorang pengguna yang mengakses Laporan Hasil Assessment, Saya ingin mendapatkan informasi jika halaman gagal dimuat, Sehingga saya dapat mencoba memuat ulang konten dengan mudah.	Given halaman tab Laporan Hasil Assessment gagal diload, When user membuka tab tersebut, Then sistem menampilkan state error dengan:
Given When Then
Case: ✅ Lihat Aktivitas	Sebagai seorang pengguna yang memiliki minimal 1 aktivitas atau program yang telah diselesaikan, Saya ingin membuka tab Aktivitas, Sehingga saya dapat melihat seluruh aktivitas stand alone dan program yang sudah diselesaikan 100% dengan urutan terbaru ke terlama, lengkap dengan detail dan status privasinya, serta dapat mengakses halaman detail masing-masing aktivitas atau program.	Given user memiliki minimal 1 aktivitas atau program yang telah diselesaikan 100%,When user membuka tab Aktivitas,Then sistem menampilkan daftar aktivitas stand alone dan program yang sudah diselesaikan 100%.
Given daftar aktivitas ditampilkan,When sistem menampilkan card,Then aktivitas dengan completion rate < 100% tidak ditampilkan.
Given daftar aktivitas ditampilkan,When sistem menampilkan card,Then card program diurutkan dari newest → oldest.
Given jumlah aktivitas ≤ 10,When sistem menampilkan daftar,Then semua aktivitas ditampilkan dalam satu halaman tanpa pagination.
Given jumlah aktivitas > 10,When sistem menampilkan daftar,Then sistem menampilkan pagination dengan maksimal 10 card per halama
Given sistem menampilkan daftar aktivitas, When setiap card ditampilkan, Then card berisi: Tagging “Publik” atau “Privat”
Given user melihat daftar aktivitas,When user mengklik salah satu card,Then sistem membuka halaman detail aktivitas stand alone atau detail program di tab baru (tribe 3).
✅ Case: Cari Aktivitas	Sebagai seorang pengguna yang sudah login, Saya ingin mencari aktivitas berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan aktivitas tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user sudah login dan berada di halaman daftar aktivitas,When halaman terbuka,Then sistem menampilkan search bar dengan placeholder “Cari aktivitas” dan ikon pencarian di sisi kanan.
Given search bar tersedia,When user mengetikkan nama aktivitas,Then sistem memproses pencarian.
Given pencarian sedang diproses,When sistem memproses query,Then tampilkan loading indicator (misal spinner atau skeleton UI) selama proses berlangsung.
Given hasil pencarian diterima,When aktivitas ditemukan,Then sistem menampilkan daftar aktivitas yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive partial match), diurutkan secara abjad ascending atau berdasarkan relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ada aktivitas yang cocok dengan kata kunci,Then sistem menampilkan pesan: “Tidak ada aktivitas dengan nama tersebut.”
Given user menghapus teks pencarian atau mengklik tombol reset,When search bar kosong,Then sistem menampilkan kembali seluruh daftar aktivitas (default state)

User Story & User Acceptance Criteria

[TIPE 2 VISITOR VIEW]

Feature	User Story	User Acceptance Criteria (UAC)
Case: ✅ Lihat Cover Profile	Sebagai seorang pengguna atau pengunjung profile publik, Saya ingin melihat cover profile pada halaman User Profile atau halaman detail profil, Sehingga saya dapat melihat identitas visual pengguna yang bersangkutan, baik default maupun custom.	Given user membuka halaman User Profile atau detail profil,When akun yang diakses bersifat publik,Then sistem menampilkan Cover Profile di bagian paling atas halaman.
Given user belum pernah mengganti cover,When halaman ditampilkan,Then sistem menampilkan default cover image
Given user sudah pernah mengganti cover,When halaman ditampilkan,Then sistem menampilkan cover image milik user.
Case: ✅ Lihat Foto Profil	Sebagai seorang pengguna atau pengunjung profile publik, Saya ingin melihat foto profil pengguna pada halaman User Profile atau halaman Detail Profil, Sehingga saya dapat mengenali pengguna tersebut, baik melalui avatar default maupun foto profil yang telah diunggah.	Given user membuka halaman User Profile atau Detail Profil,When akun yang diakses bersifat publik,Then sistem menampilkan Foto Profil user di area atas halaman
Given user belum pernah mengunggah foto profil,When halaman ditampilkan,Then sistem menampilkan avatar default.
Given user sudah pernah mengunggah foto profil,When halaman ditampilkan,Then sistem menampilkan foto profil milik user
Case: ✅ Lihat Profil Side Bar	Sebagai seorang pengguna atau pengunjung profil publik, Saya ingin melihat Profil Sidebar pada halaman User Profile (tab manapun), Sehingga saya dapat meninjau informasi lengkap user dengan tampilan rapi dan sinkron dengan halaman detail profil.	Given user membuka halaman User Profile (pada tab manapun) dan akun bersifat publik, When halaman ditampilkan, Then sistem menampilkan Profil Sidebar dengan struktur dan informasi berikut: Header Profil: Foto Profil Nama Lengkap Alamat Tentang Saya Media Sosial Bahasa Keahlian
Given ada field yang tidak memiliki data,When sidebar ditampilkan,Then field tersebut tidak ditampilkan dan field di bawahnya akan naik menggantikan posisi field yang kosong.
Given sidebar ditampilkan,When data ditampilkan,Then seluruh data di sidebar harus sinkron dengan data yang ada di halaman detail profil.
✅ Case: Lihat Detail Profil	Sebagai visitor yang membuka halaman profil user lain, Saya ingin melihat seluruh informasi publik user di tab Detail Profil, Sehingga saya dapat mengenal user lebih lengkap, termasuk identitas, prestasi, pelatihan, bahasa, keahlian, dan media sosial.	iven When Detail Profil Then Section Identitas Diri Section Alamat Domisili Section Prestasi Menampilkan daftar prestasi user dengan elemen: Section Pelatihan & Sertifikasi Menampilkan daftar pelatihan & sertifikasi user dengan elemen: Section Bahasa Menampilkan daftar bahasa yang dikuasai user dengan: Section Keahlian Section Media Sosial General Behavior tidak ditampilkan sesuai dengan data publik user sync dengan halaman profil utama Negative Case Jika tab gagal dimuat → sistem menampilkan state error: Desc: Button:
Case: ❌ Section Kosong atau Detail Profil Gagal Diload	Sebagai seorang pengguna yang mengakses profil publik, Saya ingin sistem menyesuaikan tampilan jika ada section yang kosong atau gagal dimuat, Sehingga tampilan tetap rapi dan saya dapat mencoba memuat ulang data jika terjadi error.	Given ada section di sidebar yang tidak memiliki data,When halaman ditampilkan,Then section tersebut tidak ditampilkan dan section di bawahnya naik menggantikan posisi section yang kosong.
Given seluruh tab Detail Profil gagal dimuat, When user membuka tab Detail Profil, Then sistem menampilkan state error dengan:
Given state error ditampilkan,When user mengklik tombol “Muat Ulang”,Then sistem mencoba memuat ulang tab Detail Profil (refresh).
Case: ✅ Lihat Overview	Sebagai seorang pengunjung profil publik, Saya ingin membuka tab Overview pada halaman User Profile, Sehingga saya dapat melihat ringkasan data publik dari user secara cepat tanpa harus membuka tiap tab satu per satu.	Given user membuka tab Overview pada halaman User Profile, When akun yang diakses bersifat publik, Then sistem menampilkan beberapa section utama secara berurutan:
Given setiap section memiliki data publik,When ditampilkan,Then sistem menampilkan maksimal 2 card terbaru (latest) dari data publik di tab asal masing-masing section.
Given card ditampilkan,When user mengklik salah satu card,Then sistem mengarahkan user ke halaman detail card tersebut (tab asalnya).
Given setiap section ditampilkan, When header section terlihat, Then sistem menampilkan tombol “Lihat Semua”
Given suatu section belum memiliki data/card,When halaman Overview ditampilkan,Then section tersebut tidak ditampilkan dan section di bawahnya akan naik menggantikan posisi section kosong.
Given card ditampilkan di Overview,When ditampilkan,Then bentuk tampilan dan informasi pada card sama persis dengan yang terdapat pada tab asalnya.
Case: ✅ Lihat Portofolio	Sebagai seorang visitor (pengunjung) yang membuka profil user lain, Saya ingin melihat daftar portofolio publik user tersebut di tab Portofolio, Sehingga saya dapat meninjau portofolio yang telah dibagikan tanpa mengakses konten privat.	Given visitor membuka halaman profil user lain dan visitor bukan pemilik akun,When visitor klik tab Portfolio,Then sistem menampilkan daftar portofolio milik user yang bersifat Publik saja.
Given ada portofolio yang bersifat Privat,When halaman ditampilkan,Then portofolio tersebut tidak muncul pada tampilan visitor.
Given portofolio ditampilkan, When card ditampilkan, Then card menampilkan elemen sebagai berikut:
Given ada portofolio yang dipin oleh pemilik akun, When halaman ditampilkan, Then card tersebut ditampilkan sebagai “pinned” di bagian paling atas tidak interaktif
Given visitor mengklik salah satu card portofolio,When diklik,Then sistem mengarahkan visitor ke halaman Detail Portofolio.
Given daftar portofolio ditampilkan,When urutan diterapkan,Then urutan card portofolio adalah newest/latest → oldest.
Given jumlah portofolio ≤ 10,When ditampilkan,Then seluruh portofolio tampil dalam satu halaman tanpa pagination.
Given jumlah portofolio > 10,When ditampilkan,Then sistem menampilkan pagination dengan maksimal 10 card per halaman.
Given tab Portofolio bersifat privat, atau seluruh item portofolio bersifat privat, atau akun yang diakses tidak memiliki portofolio,When visitor membuka profil,Then tab Portofolio tidak ditampilkan dan tab di sebelahnya bergeser menggantikan posisi tab Portofolio.
Case: ✅ Cari Portofolio	Sebagai seorang visitor yang membuka profil user lain, Saya ingin mencari portofolio berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan portofolio publik yang relevan tanpa harus menelusuri seluruh daftar secara manual.	Given visitor membuka halaman daftar portofolio user lain,When halaman ditampilkan,Then sistem menampilkan search bar dengan placeholder “Cari portofolio” dan ikon pencarian di sisi kanan.
Given visitor mengetikkan nama portofolio pada kolom pencarian,When visitor selesai memasukkan kata kuncinya,Then sistem menampilkan hasil portofolio yang nama/judulnya mengandung kata kunci yang diketik (case-insensitive, partial match).
Given sistem memproses pencarian,When proses berlangsung,Then tampilkan loading indicator (misal: spinner atau skeleton UI).
Given hasil pencarian diterima,When ditemukan portofolio yang sesuai,Then tampilkan daftar portofolio sesuai urutan abjad (ascending by name) atau relevansi kecocokan nama.
Given hasil pencarian diterima,When tidak ditemukan portofolio yang sesuai,Then tampilkan pesan: “Tidak ada portofolio dengan nama tersebut.”
Given visitor menghapus teks pencarian,When kolom pencarian kosong,Then sistem menampilkan kembali seluruh daftar portofolio (default state).
Case: ✅ Filter Portofolio	Sebagai seorang visitor yang membuka halaman Portofolio user lain, Saya ingin memfilter portofolio berdasarkan status privasi, sumber, dan tahun ajaran, Sehingga saya dapat menampilkan portofolio publik yang relevan dengan kriteria yang saya inginkan.	Given user berada di halaman Portofolio, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Portofolio dengan opsi filter berikut: Akses Profil Sumber Tahun Ajaran
Given modal ditampilkan,When user klik tombol “X” (Close) di pojok kanan atas,Then modal tertutup tanpa menerapkan perubahan filter.
Given modal ditampilkan,When user klik tombol “Reset” di bagian bawah kiri,Then semua pilihan filter dikosongkan dan kembali ke kondisi default.
Given user memilih filter dan klik tombol “Terapkan Filter” di bagian bawah kanan,When tombol diklik,Then modal tertutup dan sistem menampilkan daftar portofolio sesuai kriteria filter yang dipilih.
Given hasil filter diterapkan,When daftar portofolio ditampilkan,Then hasil filter langsung terlihat pada tampilan list portofolio di halaman utama.
Case: ✅ Navigasi Pagination	Sebagai seorang visitor yang membuka halaman Portofolio user lain, Saya ingin berpindah halaman pada daftar portofolio, Sehingga saya dapat melihat seluruh portofolio yang tersedia meskipun jumlahnya lebih dari 10 card per halaman.	Given user memiliki lebih dari 10 portofolio,When user klik tombol pagination (misal: Halaman 2),Then sistem menampilkan daftar maksimal 10 card portofolio sesuai halaman yang dipilih.
Given When Then newest → oldest
Case: ✅ Lihat Detail Portofolio (Otomatis)	Sebagai seorang visitor yang membuka profil user lain, Saya ingin melihat detail portofolio otomatis yang bersifat publik, Sehingga saya dapat meninjau informasi lengkap dan konten portofolio milik user tersebut tanpa mengakses portofolio privat.	Given visitor membuka halaman profil user lain,When visitor klik salah satu card portofolio otomatis publik,Then sistem menampilkan halaman detail portofolio.
Given halaman detail portofolio terbuka,When portofolio ditampilkan,Then hanya portofolio dengan status Publik yang ditampilkan.
Given halaman detail portofolio terbuka, When data portofolio ditampilkan, Then sistem menampilkan:
Given halaman detail portofolio menampilkan konten, When sistem menampilkan preview konten portofolio, Then tampil grid card berdasarkan jenis file (dokumen, foto, audio, video, dokumen lainnya)
Case: ✅ Lihat Detail Portofolio (Manual)	Sebagai seorang visitor yang membuka profil user lain, Saya ingin melihat detail portofolio manual yang bersifat publik, Sehingga saya dapat meninjau informasi lengkap dan konten portofolio milik user tersebut tanpa mengakses portofolio privat atau melakukan perubahan.	Given visitor membuka halaman profil user lain,When visitor klik salah satu card portofolio manual publik,Then sistem menampilkan halaman detail portofolio.
Given halaman detail portofolio terbuka,When portofolio ditampilkan,Then hanya portofolio dengan status Publik yang ditampilkan.
Given halaman detail portofolio terbuka, When data portofolio ditampilkan, Then sistem menampilkan:
Given halaman detail portofolio menampilkan konten, When sistem menampilkan preview konten portofolio, Then tampil grid card berdasarkan jenis file (dokumen, foto, audio, video, dokumen lainnya)

Case: ✅ Lihat Detail Dokumen Portofolio	Sebagai seorang visitor yang membuka halaman detail portofolio publik, Saya ingin membuka preview salah satu dokumen portofolio, Sehingga saya dapat meninjau konten dokumen dan informasi terkait tanpa meninggalkan halaman detail portofolio.	Given visitor berada di halaman detail portofolio publik,When visitor klik salah satu card dokumen/konten portofolio,Then sistem membuka modal preview dokumen.
Given modal preview terbuka, When sistem menampilkan konten, Then preview dokumen ditampilkan di sisi kiri modal sesuai jenis file: Foto Video Audio Dokumen (PDF/Word/PPT) URL/Link
Given modal preview terbuka, When sistem menampilkan informasi file, Then di sisi kanan modal ditampilkan:
Given visitor menutup modal,When modal ditutup,Then visitor kembali ke halaman detail portofolio tanpa perubahan tampilan sebelumnya.
Case: ✅ Lihat Sertifikat	Sebagai visitor yang membuka profil user lain, Saya ingin melihat daftar sertifikat publik milik user, Sehingga saya dapat meninjau sertifikat yang bersifat publik tanpa dapat melakukan perubahan atau melihat sertifikat privat.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Sertifikat, Then sistem menampilkan daftar sertifikat user dengan ketentuan:
Given sertifikat ditampilkan,When sistem menampilkan daftar sertifikat,Then sertifikat diurutkan dari newest → oldest berdasarkan tanggal penerbitan.
Given daftar sertifikat ditampilkan,When jumlah sertifikat ≤ 12,Then sistem menampilkan semua sertifikat dalam satu halaman tanpa pagination.
Given jumlah sertifikat > 12,When sistem menampilkan daftar sertifikat,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given setiap card sertifikat ditampilkan, When card tampil, Then card menampilkan elemen berikut:
Given visitor klik salah satu card sertifikat, Then: Detail Sertifikat URL sertifikat
Given seluruh sertifikat bersifat privat atau tab tidak memiliki sertifikat publik,Then tab Sertifikat tidak ditampilkan dan tab di sebelahnya bergeser.
Case: ✅ Cari Sertifikat	Sebagai pengguna yang ingin meninjau sertifikat saya atau publik milik user lain, Saya ingin mencari sertifikat berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan sertifikat tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user berada di halaman daftar sertifikat,When sistem menampilkan halaman,Then tampilkan search bar dengan placeholder “Cari sertifikat” dan ikon pencarian di sisi kanan.
Given user mengetikkan kata kunci pada kolom pencarian,When user selesai memasukkan kata kuncinya,Then sistem memproses pencarian (case-insensitive).
Given sistem sedang memproses pencarian,Then tampilkan loading indicator (misal: spinner atau skeleton UI).
Given hasil pencarian diterima, Then: urutan abjad (ascending by name) relevansi kecocokan nama
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar sertifikat (default state).
Additional Notes: case-insensitive partial match
Case: ✅ Filter Sertifikat	Sebagai pengguna yang ingin meninjau sertifikat tertentu, Saya ingin memfilter sertifikat berdasarkan sumber dan tahun ajaran melalui modal filter, Sehingga saya dapat melihat sertifikat yang relevan dengan kriteria yang saya pilih tanpa menelusuri seluruh daftar.	Given user berada di halaman daftar sertifikat,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Sertifikat.
Given modal filter terbuka, Then sistem menampilkan opsi filter: Sumber Tahun Ajaran
Given user ingin menutup modal tanpa menerapkan filter,When user klik tombol X (Close),Then modal tertutup dan tidak ada perubahan filter yang diterapkan.
Given user ingin mengosongkan semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter kembali ke kondisi awal (default).
Given user sudah memilih kriteria filter,When user klik tombol Terapkan Filter,Then modal tertutup dan sistem menampilkan daftar sertifikat sesuai kriteria yang dipilih.
Given filter diterapkan,Then hasil filter langsung terlihat pada tampilan list sertifikat di halaman utama.
Case: ✅ Lihat Rapor	Sebagai visitor yang mengunjungi profil user lain, Saya ingin melihat section Rapor pada tab Hasil Belajar, Sehingga saya dapat meninjau rapor publik milik user tanpa memiliki akses sebagai pemilik akun.	Given visitor membuka halaman profil user lain,When visitor masuk ke tab Hasil Belajar dan memilih section Rapor,Then sistem menampilkan daftar rapor publik milik user.
Given rapor ditampilkan,Then rapor diurutkan berdasarkan tanggal penerbitan dari newest → oldest.
Given jumlah rapor ≤ 12,Then semua rapor ditampilkan dalam satu halaman tanpa pagination.
Given jumlah rapor > 12,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given rapor ditampilkan, Then setiap card menampilkan:
Given visitor mengklik salah satu card rapor,Then sistem membuka halaman detail rapor (Tribe 3) pada tab baru.
Given tab Rapor bersifat privat, atau seluruh item bersifat privat, atau akun tidak memiliki rapor publik,Then tab Rapor tidak ditampilkan, dan tab di sebelahnya akan bergeser menggantikannya.
Case: ✅ Cari Rapor	Sebagai user yang ingin menemukan rapor tertentu, Saya ingin mencari rapor berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menampilkan rapor yang relevan tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar rapor,Then sistem menampilkan search bar dengan placeholder “Cari rapor” dan ikon pencarian di sisi kanan.
Given user mengetikkan nama rapor,When user selesai memasukkan kata kuncinya,Then sistem menampilkan rapor yang nama/judulnya mengandung kata kunci (case-insensitive partial match).
Given sistem memproses pencarian,Then tampilkan loading indicator (misal spinner atau skeleton UI) sampai hasil diterima.
Given rapor ditemukan,Then tampilkan daftar rapor sesuai urutan abjad (ascending by name) atau relevansi kecocokan nama.
Given rapor tidak ditemukan, Then tampilkan pesan: “Tidak ada rapor dengan nama tersebut.”
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar rapor (default state).
Case: ✅ Filter Rapor	Sebagai user yang ingin menampilkan rapor sesuai kriteria tertentu, Saya ingin menggunakan modal filter rapor untuk memilih status privasi dan tahun ajaran, Sehingga saya dapat melihat daftar rapor yang relevan tanpa harus menelusuri semua rapor secara manual.	Given user berada di halaman Rapor,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Rapor.
Given modal terbuka, Then tampil opsi Akses Profil: Publik, Privat
Given modal terbuka, Then tampil opsi Tahun Ajaran (multi-select):
Given user mengklik tombol X (Close) di pojok kanan atas modal,Then modal tertutup tanpa menerapkan filter.
Given user mengklik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user mengklik tombol Terapkan Filter,Then sistem menutup modal dan menampilkan daftar rapor sesuai kriteria filter yang dipilih.
Given filter diterapkan,Then hasil filter langsung ditampilkan pada list Rapor di halaman utama.
Case: ✅ Lihat Laporan Belajar (Visitor)	Sebagai visitor yang melihat profil user lain, Saya ingin melihat daftar Laporan Belajar publik, Sehingga saya dapat mengetahui pencapaian belajar user tanpa harus login atau memiliki akses khusus.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Hasil Belajar dan memilih section Laporan Belajar, Then sistem menampilkan daftar Laporan Belajar dengan ketentuan berikut: Publik Privat newest → oldest 12 card pagination
Given daftar card ditampilkan, Then setiap card menampilkan:
Given visitor mengklik salah satu card Laporan Belajar,Then sistem membuka halaman detail Laporan Belajar (Tribe 3) di tab baru.
Given seluruh item Laporan Belajar bersifat privat atau tidak ada data publik,Then tab Laporan Belajar tidak ditampilkan, dan tab sebelahnya akan bergeser.
Case: ✅ Cari Laporan Belajar	Sebagai user yang terdaftar, Saya ingin mencari Laporan Belajar berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus men-scroll seluruh daftar.	Given user membuka halaman daftar Laporan Belajar,Then sistem menampilkan search bar dengan placeholder “Cari Laporan Belajar” dan ikon pencarian di sisi kanan.
Given user mengetikkan nama Laporan Belajar di kolom pencarian,When user selesai memasukkan kata kuncinya,Then sistem menampilkan daftar Laporan Belajar yang nama/judulnya mengandung kata kunci (case-insensitive).
Given pencarian sedang diproses,Then tampilkan loading indicator (spinner atau skeleton UI) hingga hasil diterima.
Given hasil pencarian diterima, Then sistem: urut abjad (ascending)
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar Laporan Belajar (default state).
Case: ✅ Filter Laporan Belajar	Sebagai user yang terdaftar, Saya ingin memfilter Laporan Hasil Belajar berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menemukan laporan tertentu sesuai kriteria yang saya pilih dengan cepat.	Given user berada di halaman Laporan Hasil Belajar,When user mengklik tombol Filter,Then sistem menampilkan Modal Filter Laporan Hasil Belajar.
Given Modal Filter terbuka, Then user dapat memilih Akses Profil:
Given Modal Filter terbuka, Then user dapat memilih Tahun Ajaran (multi-select):
Given user ingin menutup modal tanpa menerapkan filter,When user klik tombol “X” (Close),Then modal akan tertutup tanpa mengubah daftar Laporan Hasil Belajar.
Given user ingin menghapus semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user sudah memilih kriteria filter,When user klik tombol Terapkan Filter,Then modal akan tertutup,And sistem menampilkan daftar Laporan Hasil Belajar sesuai kriteria filter yang dipilih, langsung diterapkan pada halaman utama.
Case: ✅ Lihat Perkembangan Murid	Sebagai visitor yang mengakses profil user lain, Saya ingin melihat daftar Laporan Perkembangan Murid yang bersifat publik, Sehingga saya dapat mengetahui perkembangan murid tanpa perlu login sebagai pemilik akun.	Given visitor membuka halaman profil user lain,When visitor masuk ke tab Hasil Belajar dan memilih section Laporan Perkembangan Murid,Then sistem menampilkan daftar Laporan Perkembangan Murid yang bersifat publik.
Given visitor melihat daftar Laporan Perkembangan Murid, Then setiap card menampilkan informasi berikut:
Given visitor klik salah satu card Laporan Perkembangan Murid,Then sistem membuka halaman detail laporan pada tab baru (Tribe 3).
Given jumlah laporan lebih dari 12,Then sistem menampilkan pagination dengan maksimal 12 card per halaman.
Given tab bersifat privat, atau seluruh item bersifat privat, atau akun yang diakses tidak memiliki data,Then tab tidak ditampilkan dan tab di sebelahnya bergeser.
Given visitor bukan pemilik akun,Then tidak ada ikon aksi (edit, pin, dsb) yang ditampilkan.
Case: ✅ Cari Laporan Perkembangan Murid	Sebagai user yang telah login, Saya ingin mencari Laporan Perkembangan Murid berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat tanpa harus menelusuri seluruh daftar.	Given user membuka halaman daftar Laporan Perkembangan Murid,Then sistem menampilkan search bar dengan placeholder: “Cari laporan perkembangan murid” dan ikon pencarian di sisi kanan.
Given user mengetikkan kata kunci pada kolom pencarian,When user selesai memasukkan kata kuncinya,Then sistem menampilkan hasil laporan perkembangan murid yang nama/judulnya mengandung kata kunci (case-insensitive).
Given proses pencarian sedang berlangsung,Then tampilkan loading indicator (misal spinner atau skeleton UI).
Given hasil pencarian diterima: urutan abjad (ascending by name) relevansi kecocokan nama
Given user menghapus teks pencarian,Then sistem menampilkan kembali seluruh daftar laporan perkembangan murid (default state).
Case: ✅ Filter Laporan Perkembangan Murid	Sebagai user yang telah login, Saya ingin memfilter Laporan Perkembangan Murid berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menampilkan laporan yang relevan dengan cepat sesuai kebutuhan saya.	Given user berada di halaman Laporan Perkembangan Murid, When user mengklik tombol Filter, Then sistem menampilkan Modal Filter Laporan Perkembangan Murid dengan opsi: Akses Profil Tahun Ajaran
Given user ingin menutup modal tanpa mengubah filter,When user klik tombol X (Close),Then modal ditutup tanpa menerapkan perubahan filter.
Given user ingin menghapus semua pilihan filter,When user klik tombol Reset,Then semua pilihan filter dikosongkan dan kembali ke kondisi awal (default).
Given user telah memilih kriteria filter,When user klik tombol Terapkan Filter,Then sistem menutup modal dan menampilkan daftar Laporan Perkembangan Murid sesuai filter yang dipilih.
Given hasil filter diterapkan,Then tampilan daftar langsung diperbarui di halaman utama tanpa perlu refresh manual.
Case: ✅ Navigasi Pagination	Sebagai user yang telah login, Saya ingin berpindah halaman daftar Rapor / Laporan Hasil Belajar / Laporan Perkembangan Murid menggunakan pagination, Sehingga saya dapat melihat seluruh data secara terstruktur dan tidak terbatas pada halaman pertama saja.	Given user memiliki lebih dari 12 item (rapor, laporan hasil belajar, atau laporan perkembangan murid),When user klik tombol pagination (misal Halaman 2),Then sistem menampilkan daftar maksimal 12 card sesuai halaman yang dipilih.And urutan card tetap newest → oldest secara global.
Given sistem sedang memuat data halaman yang dipilih,Then tampilkan loading indicator (misal spinner atau skeleton UI) sampai data selesai dimuat.
Negative Case Given Then sistem menampilkan state error: Desc: Button:
Case: ✅ Lihat Hasil Assessment	Sebagai visitor yang membuka profil user lain, Saya ingin melihat tab Laporan Hasil Assessment, Sehingga saya dapat mengetahui hasil assessment yang bersifat publik milik user tersebut.	Given visitor membuka halaman profil user lain, When visitor masuk ke tab Laporan Hasil Assessment, Then sistem menampilkan daftar hasil assessment publik user dengan ketentuan: newest → oldest 12 card per halaman pagination
Case: ✅ Cari Laporan Hasil Assessment	Sebagai user yang telah login, Saya ingin mencari Laporan Hasil Assessment berdasarkan nama, Sehingga saya dapat menemukan laporan tertentu dengan cepat.	Given Laporan Hasil Assessment When Then hasil assessment mengandung kata kunci During Search: loading indicator After Search: abjad (ascending by name) relevansi nama Reset / Clear Search:
Case: ✅ Filter Laporan Hasil Assessment	Sebagai user yang telah login, Saya ingin memfilter Laporan Hasil Assessment berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat menampilkan laporan yang relevan sesuai kriteria yang saya pilih.	Given Laporan Hasil Assessment When Filter Then Modal Filter Laporan Hasil Assessment Tahun Ajaran: Modal Buttons: Close (X): Reset: Terapkan Filter: Filter Application: langsung diterapkan
✅ Case: Lihat Aktivitas	Sebagai visitor yang membuka profil user lain, Saya ingin melihat aktivitas dan program yang sudah diselesaikan 100% dan bersifat publik, Sehingga saya dapat menilai capaian user tanpa melihat aktivitas yang belum selesai atau bersifat privat.	Given visitor membuka tab Aktivitas pada halaman profil user lain, When user pemilik akun memiliki minimal satu aktivitas atau program publik yang selesai 100%, Then sistem menampilkan daftar aktivitas/public program dengan ketentuan: completion rate = 100% publik newest → oldest Pagination:
Case: ✅ Cari Aktivitas	Sebagai visitor yang membuka profil user lain, Saya ingin mencari aktivitas berdasarkan nama melalui kolom pencarian, Sehingga saya dapat menemukan aktivitas tertentu tanpa harus menelusuri semua card aktivitas.	Given When Then nama/judulnya mengandung kata kunci Pencarian dimulai ketika: Selama proses pencarian: loading indicator Setelah hasil diterima: urutan abjad (ascending by name) Reset atau hapus teks pencarian:
Case: ✅ Filter Aktivitas	Sebagai visitor atau user yang membuka halaman Aktivitas, Saya ingin memfilter aktivitas berdasarkan status privasi dan tahun ajaran, Sehingga saya dapat melihat daftar aktivitas yang relevan sesuai kriteria saya.	Given When Filter Then Modal Filter Aktivitas Akses Profil: Tahun Ajaran: Tombol dalam modal: Close (X): Reset: Terapkan Filter: Hasil filter: Negative Case: Jika halaman gagal dimuat, sistem menampilkan state error: Desc: Button:
Case: ✅ Akun Privat

User Story & User Acceptance Criteria

ADDITIONAL CASE FOR ALL TYPE

Case: ✅ Akun Privat Diakses Oleh Visitor

User Story Sebagai visitor yang membuka halaman profil user lain, Jika akun yang diakses bersifat privat, Saya ingin melihat informasi bahwa akun tersebut privat dan tidak dapat mengakses datanya, Sehingga saya memahami bahwa semua informasi profil bersifat terbatas. User Acceptance Criteria (UAC) Given visitor membuka halaman profil user yang privat, When halaman dimuat, Then sistem menampilkan:

Tidak ada data profil yang ditampilkan sama sekali (Detail Profil, portofolio, sertifikat, rapor, laporan belajar, aktivitas, dll.).

Informasi teks/alert yang jelas menyatakan:

“Akun ini bersifat privat. Konten tidak dapat diakses.”

Tampilan tetap rapi dan user-friendly, tanpa error atau broken layout.

General Behavior

Semua tab dan section lain yang biasanya muncul untuk akun publik tidak ditampilkan.

Visitor tidak dapat menavigasi ke konten internal/privat.

Jika visitor mencoba mengakses URL langsung ke portofolio/rapor/sertifikat → sistem menampilkan halaman error atau notifikasi akun privat.

Team Docs (Recovery)