Titles and navigation

src/components/group-form.tsx

@@ -22,7 +22,7 @@ import { Input } from '@/components/ui/input'
 import { getGroup } from '@/lib/api'
 import { GroupFormValues, groupFormSchema } from '@/lib/schemas'
 import { zodResolver } from '@hookform/resolvers/zod'
-import { Trash2 } from 'lucide-react'
+import { Save, Trash2 } from 'lucide-react'
 import { useFieldArray, useForm } from 'react-hook-form'
 
 export type Props = {
@@ -106,6 +106,7 @@ export function GroupForm({ group, onSubmit }: Props) {
             />
           </CardContent>
         </Card>
+
         <Card className="mb-4">
           <CardHeader>
             <CardTitle>Participants</CardTitle>
@@ -160,7 +161,12 @@ export function GroupForm({ group, onSubmit }: Props) {
           </CardFooter>
         </Card>
 
-        <SubmitButton loadingContent="Submitting…">Submit</SubmitButton>
+        <SubmitButton
+          size="lg"
+          loadingContent={group ? 'Saving…' : 'Creating…'}
+        >
+          <Save className="w-4 h-4 mr-2" /> {group ? <>Save</> : <> Create</>}
+        </SubmitButton>
       </form>
     </Form>
   )

src/components/progress-bar.tsx

@@ -6,7 +6,7 @@ export function ProgressBar() {
     <Next13ProgressBar
       height="2px"
       color="#64748b"
-      options={{ showSpinner: true }}
+      options={{ showSpinner: false }}
       showOnShallow
     />
   )