create component for pull requests(#82)

webapp/src/app/ui/pull-request-widget/pull-request-widget.component.html

@@ -0,0 +1,13 @@
+<div class="border border-gray-300 rounded-lg p-4 bg-white w-72">
+  <!-- Header -->
+  <div class="flex justify-between items-center mb-2 text-xs text-gray-500">
+    <span class="font-bold">{{ pullRequest().repository.name }} #{{ pullRequest().id }} on {{ pullRequest().createdAt }}</span>
+    <span class="flex items-center space-x-2">
+      <span class="text-green-600 font-bold">+{{ pullRequest().additions }}</span>
+      <span class="text-red-600 font-bold">-{{ pullRequest().deletions }}</span>
+    </span>
+  </div>
+
+  <!-- Title -->
+  <div class="font-bold text-sm mb-3">{{ pullRequest().title }}</div>
+</div>

webapp/src/app/ui/pull-request-widget/pull-request-widget.component.ts

@@ -0,0 +1,11 @@
+import { Component, input } from '@angular/core';
+import { PullRequest } from '@app/core/modules/openapi';
+
+@Component({
+  selector: 'app-pull-request-widget',
+  templateUrl: './pull-request-widget.component.html',
+  standalone: true
+})
+export class PullRequestWidgetComponent {
+  pullRequest = input.required<PullRequest>();
+}

webapp/src/app/ui/pull-request-widget/pull-request-widget.stories.ts

@@ -0,0 +1,36 @@
+import { Meta, StoryObj } from '@storybook/angular';
+import { PullRequestWidgetComponent } from './pull-request-widget.component';
+import { PullRequest, Repository } from '@app/core/modules/openapi';
+
+const meta: Meta<PullRequestWidgetComponent> = {
+  title: 'Components/PullRequestCard',
+  component: PullRequestWidgetComponent,
+  tags: ['autodocs'] // Auto-generate docs if enabled
+};
+
+export default meta;
+
+type Story = StoryObj<PullRequestWidgetComponent>;
+
+const repo: Repository = {
+  name: 'Artemis',
+  nameWithOwner: 'artemis-education/artemis',
+  defaultBranch: 'master',
+  visibility: 'PUBLIC',
+  url: 'http://example.com'
+};
+
+const pullRequest: PullRequest = {
+  title: 'Add feature X',
+  additions: 10,
+  deletions: 5,
+  url: 'http://example.com',
+  state: 'OPEN',
+  repository: repo,
+  createdAt: 'Jan 1',
+  id: 12
+};
+
+export const Default: Story = {
+  args: { pullRequest }
+};