refactor: replace deprecated input with formcontrol in announcement modal

frontend/src/components/Modals/AnnouncementModal.vue

@@ -15,20 +15,18 @@
 	>
 		<template #body-content>
 			<div class="flex flex-col gap-4">
-				<div class="">
+				<FormControl
-					<div class="mb-1.5 text-sm text-ink-gray-5">
+					:label="__('Subject')"
-						{{ __('Subject') }}
+					type="text"
-						<span class="text-ink-red-3">*</span>
+					v-model="announcement.subject"
-					</div>
+					:required="true"
-					<Input type="text" v-model="announcement.subject" />
+				/>
-				</div>
+				<FormControl
-				<div class="">
+					:label="__('Reply To')"
-					<div class="mb-1.5 text-sm text-ink-gray-5">
+					type="text"
-						{{ __('Reply To') }}
+					v-model="announcement.replyTo"
-						<span class="text-ink-red-3">*</span>
+					:required="true"
-					</div>
+				/>
-					<Input type="text" v-model="announcement.replyTo" />
-				</div>
 				<div class="mb-4">
 					<div class="mb-1.5 text-sm text-ink-gray-5">
 						{{ __('Announcement') }}
@@ -45,7 +43,13 @@
 	</Dialog>
 </template>
 <script setup>
-import { Dialog, Input, TextEditor, createResource, toast } from 'frappe-ui'
+import {
+	Dialog,
+	FormControl,
+	TextEditor,
+	createResource,
+	toast,
+} from 'frappe-ui'
 import { reactive } from 'vue'
 
 const show = defineModel()