feat(ui): loading spinner on project creation (#219)

### TL;DR
This pull request adds a loading icon to the 'Deploy' button in the project template creation form.

### What changed?
- Imported `LoadingIcon` from `components/shared/CustomIcon`.
- Modified the `Button` component to conditionally display the `LoadingIcon` when `isLoading` is `true`. The icon will animate by spinning.

### How to test?
1. Navigate to the project template creation form.
2. Fill in the required fields.
3. Click the 'Deploy' button.
4. Ensure the loading icon appears and spins when the button is disabled (when `isLoading` is `true`).

### Why make this change?
This change provides visual feedback to users, indicating that their action is being processed, thereby enhancing user experience.

---

packages/frontend/src/pages/org-slug/projects/create/template/index.tsx

@@ -11,7 +11,10 @@ import { Template } from '../../../../../types/types';
 import { Heading } from 'components/shared/Heading';
 import { Input } from 'components/shared/Input';
 import { Select, SelectOption } from 'components/shared/Select';
-import { ArrowRightCircleFilledIcon } from 'components/shared/CustomIcon';
+import {
+  ArrowRightCircleFilledIcon,
+  LoadingIcon,
+} from 'components/shared/CustomIcon';
 import { Checkbox } from 'components/shared/Checkbox';
 import { Button } from 'components/shared/Button';
 import { useToast } from 'components/shared/Toast';
@@ -192,7 +195,13 @@ const CreateRepo = () => {
             {...buttonSize}
             type="submit"
             disabled={!Boolean(template.repoFullName) || isLoading}
-            rightIcon={<ArrowRightCircleFilledIcon />}
+            rightIcon={
+              isLoading ? (
+                <LoadingIcon className="animate-spin" />
+              ) : (
+                <ArrowRightCircleFilledIcon />
+              )
+            }
           >
             Deploy
           </Button>