{ "$schema": "https://uipkge.dev/schema/registry-item.json", "name": "assignment-submission-dropzone", "title": "Assignment Submission Dropzone", "type": "registry:block", "files": [ { "path": "packages/registry-angular/blocks/assignment-submission-dropzone/assignment-submission-dropzone.component.ts", "content": "// University coursework submission portal with plagiarism check indicator, grading rubric,\n// and deadline timer. Port of the React block 1:1.\nimport {\n ChangeDetectionStrategy,\n Component,\n DestroyRef,\n ElementRef,\n Input,\n ViewChild,\n inject,\n signal,\n} from '@angular/core'\nimport {\n Award,\n BookOpen,\n CheckCircle2,\n Clock,\n FileArchive,\n GraduationCap,\n Info,\n LucideAngularModule,\n RotateCcw,\n Save,\n Send,\n ShieldAlert,\n ShieldCheck,\n Timer,\n Trash2,\n UploadCloud,\n} from 'lucide-angular'\nimport { cn } from '@/lib/utils'\nimport { UiBadgeComponent } from '@/ui/badge/badge.component'\nimport { UiButtonComponent } from '@/ui/button/button.component'\nimport {\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardFooterComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n} from '@/ui/card/card.component'\nimport { UiProgressComponent } from '@/ui/progress/progress.component'\nimport { UiSeparatorComponent } from '@/ui/separator/separator.component'\nimport { UiTextareaComponent } from '@/ui/textarea/textarea.component'\n\nexport interface AttachedFile {\n name: string\n size: string\n uploadedAt: string\n similarity: number\n status: string\n}\n\nexport interface RubricCriterion {\n label: string\n points: number\n}\n\nexport interface RubricCategory {\n id: string\n title: string\n points: number\n percentage: number\n criteria: RubricCriterion[]\n}\n\nconst defaultRubricCategories: RubricCategory[] = [\n {\n id: 'architecture',\n title: 'Architecture & Fault Tolerance',\n points: 40,\n percentage: 40,\n criteria: [\n { label: 'Consensus algorithm implementation (Raft / Paxos) & partition resilience', points: 20 },\n { label: 'Service discovery, dynamic load balancing, & circuit breaking', points: 15 },\n { label: 'Data replication & linearizable consistency guarantees', points: 5 },\n ],\n },\n {\n id: 'code-quality',\n title: 'Code Quality & Test Coverage',\n points: 30,\n percentage: 30,\n criteria: [\n { label: 'Automated unit, fuzz, & integration test suite (>85% coverage)', points: 15 },\n { label: 'Idiomatic concurrency patterns, memory safety, clean modularity', points: 10 },\n { label: 'Reproducible CI/CD pipeline automation & static analysis pass', points: 5 },\n ],\n },\n {\n id: 'performance',\n title: 'Performance Benchmarks',\n points: 20,\n percentage: 20,\n criteria: [\n { label: 'Sustained throughput under load (>15,000 req/sec benchmark)', points: 10 },\n { label: 'P99 latency SLA (<25ms under 50% simulated node failure)', points: 10 },\n ],\n },\n {\n id: 'documentation',\n title: 'Documentation & API Specs',\n points: 10,\n percentage: 10,\n criteria: [\n { label: 'OpenAPI 3.1 & gRPC Protobuf schema specifications', points: 5 },\n { label: 'System architecture design doc & production deployment runbook', points: 5 },\n ],\n },\n]\n\nconst DEFAULT_FILE: AttachedFile = {\n name: 'distributed_system_v1.zip',\n size: '18.4 MB',\n uploadedAt: 'Aug 24, 14:22 PST',\n similarity: 0.8,\n status: 'Ready to submit',\n}\n\nconst DEFAULT_NOTES =\n 'Included benchmark logs in the /docs folder. All 12 distributed Raft consensus nodes passed the Chaos Mesh partition tests under 500ms latency simulation.'\n\n@Component({\n changeDetection: ChangeDetectionStrategy.Eager,\n selector: 'ui-assignment-submission-dropzone, [ui-assignment-submission-dropzone]',\n standalone: true,\n // React renders the root
itself: the host stays out of layout and `class` goes to the root.\n host: { '[attr.class]': '\"contents\"' },\n imports: [\n LucideAngularModule,\n UiBadgeComponent,\n UiButtonComponent,\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardFooterComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n UiProgressComponent,\n UiSeparatorComponent,\n UiTextareaComponent,\n ],\n template: `\n
\n \n
\n
\n
\n
\n
\n \n \n CS 401 · Advanced Distributed Systems\n \n \n \n 100 Points Possible\n \n
\n\n

\n Final Project: Distributed Microservices Architecture\n

\n\n

\n Term: Fall 2026 · Instructor: Prof. Elena Rostova · Stanford School of Engineering\n

\n
\n\n \n
\n \n \n Due Friday, Aug 28 at 23:59 PST · 4 Days Left\n \n\n
\n \n
\n
\n 04\n d\n
\n :\n
\n 07\n h\n
\n :\n
\n 32\n m\n
\n :\n
\n 15\n s\n
\n
\n
\n
\n
\n
\n
\n\n \n @if (isSubmitted()) {\n \n
\n
\n \n
\n
\n
\n

Coursework Submitted Successfully

\n Receipt #SUB-CS401-2026-98124\n
\n

\n Submission timestamp: August 24, 2026 at 14:25 PST · Hash:\n sha256:4a8b...7f12\n

\n
\n
\n
\n \n
\n
\n }\n\n \n
\n \n
\n
\n
\n
\n
\n

Submission & File Upload

\n

\n Upload your completed project archive, code repository bundle, and accompanying documentation.\n

\n
\n Attempt 1 of 3\n
\n
\n\n
\n \n
\n \n
\n

Accepted formats: PDF, ZIP, TAR.GZ · Max file size: 50 MB

\n

\n Ensure all Docker Compose manifests, benchmarking scripts, and unit tests are included in the\n archive root.\n

\n
\n
\n\n \n
\n \n\n \n \n \n
\n\n
\n

Drag and drop your project archive here

\n

or select a file directly from your local filesystem

\n
\n\n
\n \n
\n\n
\n .zip\n .tar.gz\n .pdf\n
\n
\n
\n\n \n
\n
\n \n Attached Files ({{ file() ? '1' : '0' }} / 1)\n \n @if (!file()) {\n No file attached\n }\n
\n\n @if (file(); as attached) {\n \n
\n \n \n
\n
\n

{{ attached.name }}

\n

{{ attached.size }} · {{ attached.uploadedAt }}

\n
\n
\n\n
\n {{ attached.size }}\n \n {{ attached.status }}\n \n \n \n \n
\n
\n } @else {\n \n Sample archive cleared.\n \n Restore default file\n \n
\n }\n
\n\n \n @if (file(); as scanned) {\n
\n
\n
\n @if (isCleanSimilarity()) {\n \n } @else {\n \n }\n
\n

Academic Integrity & Plagiarism Pre-Scan

\n

\n Scanned against 14.2M academic repositories & public open-source codebases\n

\n
\n
\n\n \n \n {{ scanned.similarity }}% Similarity · {{ isCleanSimilarity() ? 'Clean' : 'Needs Review' }}\n \n
\n\n
\n
\n Overall similarity index\n \n {{ scanned.similarity }}% (Max threshold: 15.0%)\n \n
\n \n
\n\n
\n
\n Internet Sources\n 0.0% match\n
\n
\n Peer Submissions\n 0.0% match\n
\n
\n Standard Boilerplate\n {{ scanned.similarity }}% (Apache 2.0)\n
\n
\n
\n }\n\n \n
\n \n \n

\n Provide notes on environment configurations, docker flags, or benchmark reproducibility steps.\n

\n
\n \n\n \n
\n \n @if (isDraftSaved()) {\n Draft saved successfully!\n } @else {\n Draft auto-saved 2 mins ago · rev 3\n }\n
\n\n
\n \n \n Save Draft\n \n \n \n Submit Assignment\n \n
\n \n \n \n\n \n
\n
\n
\n
\n
\n

\n \n Grading Rubric\n

\n

100 Points Total · Evaluated against course criteria

\n
\n Pass: 70 pts\n
\n
\n\n
\n @for (category of rubricCategories; track category.id; let last = $last) {\n
\n
\n
\n

{{ category.title }}

\n \n {{ category.points }} pts ({{ category.percentage }}%)\n \n
\n \n
\n\n
    \n @for (criterion of category.criteria; track criterion.label) {\n
  • \n
    \n ·\n {{ criterion.label }}\n
    \n {{ criterion.points }} pts\n
    • \n }\n
\n\n @if (!last) {\n
\n }\n
\n }\n
\n\n \n
\n \n

\n Late Submission Policy: Deductions of 5% apply\n per 24 hours delayed up to a maximum 48-hour grace period.\n

\n
\n
\n
\n \n \n \n `,\n})\nexport class UiAssignmentSubmissionDropzoneComponent {\n protected readonly Award = Award\n protected readonly BookOpen = BookOpen\n protected readonly CheckCircle2 = CheckCircle2\n protected readonly Clock = Clock\n protected readonly FileArchive = FileArchive\n protected readonly GraduationCap = GraduationCap\n protected readonly Info = Info\n protected readonly RotateCcw = RotateCcw\n protected readonly Save = Save\n protected readonly Send = Send\n protected readonly ShieldAlert = ShieldAlert\n protected readonly ShieldCheck = ShieldCheck\n protected readonly Timer = Timer\n protected readonly Trash2 = Trash2\n protected readonly UploadCloud = UploadCloud\n\n protected readonly rubricCategories = defaultRubricCategories\n\n @ViewChild('fileInput') private fileInput?: ElementRef\n\n @Input() set initialFile(v: AttachedFile | null | undefined) {\n this.file.set(v === undefined ? { ...DEFAULT_FILE } : v ? { ...v } : null)\n }\n @Input() set initialNotes(v: string) {\n if (v !== undefined) this.notes.set(v)\n }\n @Input() set initialSubmitted(v: boolean) {\n this.isSubmitted.set(!!v)\n }\n @Input('class') className?: string\n\n readonly file = signal({ ...DEFAULT_FILE })\n readonly notes = signal(DEFAULT_NOTES)\n readonly isSubmitted = signal(false)\n readonly isDraftSaved = signal(false)\n readonly isDragging = signal(false)\n\n private draftTimer: ReturnType | undefined\n\n constructor() {\n inject(DestroyRef).onDestroy(() => clearTimeout(this.draftTimer))\n }\n\n get rootClass(): string {\n return cn('space-y-6', this.className)\n }\n\n get dropzoneClass(): string {\n return cn(\n 'group relative flex flex-col items-center justify-center rounded-xl border-2 border-dashed p-8 text-center transition-colors duration-200',\n this.isDragging()\n ? 'border-primary bg-primary/5'\n : 'border-border bg-muted/10 hover:border-primary/50 hover:bg-muted/20',\n )\n }\n\n get scanPanelClass(): string {\n return cn(\n 'space-y-3 rounded-lg border p-4 shadow-xs transition-colors',\n this.isCleanSimilarity()\n ? 'border-success/30 bg-success/5 dark:bg-success/10'\n : 'border-warning/30 bg-warning/5 dark:bg-warning/10',\n )\n }\n\n isCleanSimilarity(): boolean {\n const f = this.file()\n return !f || f.similarity < 10\n }\n\n triggerBrowse(): void {\n this.fileInput?.nativeElement.click()\n }\n\n handleFileInput(event: Event): void {\n const input = event.target as HTMLInputElement\n const picked = input.files?.[0]\n if (picked) this.attachPickedFile(picked.name, picked.size)\n }\n\n handleDrop(event: DragEvent): void {\n event.preventDefault()\n this.isDragging.set(false)\n const picked = event.dataTransfer?.files?.[0]\n if (picked) this.attachPickedFile(picked.name, picked.size)\n }\n\n handleDragOver(event: DragEvent): void {\n event.preventDefault()\n this.isDragging.set(true)\n }\n\n handleDragLeave(event: DragEvent): void {\n event.preventDefault()\n this.isDragging.set(false)\n }\n\n removeFile(): void {\n this.file.set(null)\n }\n\n restoreSampleFile(): void {\n this.file.set({ ...DEFAULT_FILE })\n }\n\n handleSaveDraft(): void {\n this.isDraftSaved.set(true)\n clearTimeout(this.draftTimer)\n this.draftTimer = setTimeout(() => this.isDraftSaved.set(false), 3000)\n }\n\n handleSubmit(): void {\n if (!this.file()) return\n this.isSubmitted.set(true)\n }\n\n handleResetSubmission(): void {\n this.isSubmitted.set(false)\n }\n\n private attachPickedFile(name: string, sizeBytes: number): void {\n this.file.set({\n name,\n size: `${(sizeBytes / (1024 * 1024)).toFixed(1)} MB`,\n uploadedAt: 'Just now',\n similarity: 0.8,\n status: 'Ready to submit',\n })\n }\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/assignment-submission-dropzone/assignment-submission-dropzone.component.ts" }, { "path": "packages/registry-angular/blocks/assignment-submission-dropzone/index.ts", "content": "export {\n UiAssignmentSubmissionDropzoneComponent,\n type AttachedFile,\n type RubricCategory,\n type RubricCriterion,\n} from './assignment-submission-dropzone.component'\n", "type": "registry:block", "target": "~/src/app/components/blocks/assignment-submission-dropzone/index.ts" } ], "dependencies": [ "lucide-angular" ], "devDependencies": [], "registryDependencies": [ "https://uipkge.dev/r/angular/badge.json", "https://uipkge.dev/r/angular/button.json", "https://uipkge.dev/r/angular/card.json", "https://uipkge.dev/r/angular/progress.json", "https://uipkge.dev/r/angular/separator.json", "https://uipkge.dev/r/angular/textarea.json" ], "description": "University coursework submission portal with plagiarism check indicator, grading rubric, and deadline timer.", "categories": [ "education", "app", "forms", "dashboard" ] }