move ui to core

apps/admin-dashboard/app/routes/_dashboard.students.import.scholarships.tsx

@@ -10,17 +10,13 @@ import {
 } from '@remix-run/node';
 import { Form as RemixForm, useActionData } from '@remix-run/react';
 
-import { importScholarshipRecipients } from '@oyster/core/scholarships';
-import { ImportRecipientsInput } from '@oyster/core/scholarships.types';
 import {
-  Button,
-  FileUploader,
-  Form,
-  getErrors,
-  Modal,
-  validateForm,
-} from '@oyster/ui';
+  ImportRecipientsInput,
+  importScholarshipRecipients,
+} from '@oyster/core/scholarships';
+import { Button, Form, getErrors, Modal, validateForm } from '@oyster/ui';
 
+import { ScholarshipFileField } from '@/modules/scholarship/scholarship.ui';
 import { Route } from '@/shared/constants';
 import {
   commitSession,
@@ -72,45 +68,22 @@ export async function action({ request }: ActionFunctionArgs) {
 }
 
 export default function ImportScholarshipsPage() {
+  const { error, errors } = getErrors(useActionData<typeof action>());
+
   return (
     <Modal onCloseTo={Route['/students']}>
       <Modal.Header>
         <Modal.Title>Import Scholarship Recipients</Modal.Title>
         <Modal.CloseButton />
       </Modal.Header>
 
-      <ImportScholarshipsForm />
+      <RemixForm className="form" method="post" encType="multipart/form-data">
+        <ScholarshipFileField error={errors.file} />
+        <Form.ErrorMessage>{error}</Form.ErrorMessage>
+        <Button.Group>
+          <Button.Submit>Import</Button.Submit>
+        </Button.Group>
+      </RemixForm>
     </Modal>
   );
 }
-
-const keys = ImportRecipientsInput.keyof().enum;
-
-function ImportScholarshipsForm() {
-  const { error, errors } = getErrors(useActionData<typeof action>());
-
-  return (
-    <RemixForm className="form" method="post" encType="multipart/form-data">
-      <Form.Field
-        description="Please upload a .csv file."
-        error={errors.file}
-        label="File"
-        labelFor={keys.file}
-        required
-      >
-        <FileUploader
-          accept={['text/csv']}
-          id={keys.file}
-          name={keys.file}
-          required
-        />
-      </Form.Field>
-
-      <Form.ErrorMessage>{error}</Form.ErrorMessage>
-
-      <Button.Group>
-        <Button.Submit>Import</Button.Submit>
-      </Button.Group>
-    </RemixForm>
-  );
-}

packages/core/package.json

@@ -31,7 +31,7 @@
     "./resume-books.types": "./src/modules/resume-book/resume-book.types.ts",
     "./resume-books.ui": "./src/modules/resume-book/resume-book.ui.tsx",
     "./scholarships": "./src/modules/scholarship/scholarship.core.ts",
-    "./scholarships.types": "./src/modules/scholarship/scholarship.types.ts",
+    "./scholarships.ui": "./src/modules/scholarship/scholarship.ui.tsx",
     "./slack.server": "./src/modules/slack/index.server.ts"
   },
   "scripts": {

packages/core/src/modules/scholarship/scholarship.core.ts

@@ -13,6 +13,8 @@ import {
 import { ColorStackError } from '@/shared/errors';
 import { parseCsv } from '@/shared/utils/csv.utils';
 
+export { ImportRecipientsInput } from '@/modules/scholarship/scholarship.types';
+
 const ScholarshipRecipientRow = z.object({
   Amount: ScholarshipRecipient.shape.amount,
 

packages/core/src/modules/scholarship/scholarship.ui.tsx

@@ -0,0 +1,26 @@
+import { type FieldProps, FileUploader, Form } from '@oyster/ui';
+
+import { ImportRecipientsInput } from '@/modules/scholarship/scholarship.types';
+
+const importKeys = ImportRecipientsInput.keyof().enum;
+
+export function ScholarshipFileField({
+  error,
+}: Pick<FieldProps<string>, 'error'>) {
+  return (
+    <Form.Field
+      description="Please upload a .csv file."
+      error={error}
+      label="File"
+      labelFor={importKeys.file}
+      required
+    >
+      <FileUploader
+        accept={['text/csv']}
+        id={importKeys.file}
+        name={importKeys.file}
+        required
+      />
+    </Form.Field>
+  );
+}