info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-09-03 14:22:41 +02:00
Code Issues Releases Wiki Activity

Update tell us more

Browse Source
This commit is contained in:
Kamran Ahmed
2025-05-27 16:47:00 +01:00
parent 1ba3583708
commit 2e43e0615f
2 changed files with 12 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/UserPersona/UpdatePersonaModal.tsx
View File

@@ -57,9 +57,10 @@ export function UpdatePersonaModal(props: UpdatePersonaModalProps) {
bodyClassName="p-4"
>
<div className="mb-8 text-left">
<h2 className="text-lg font-semibold">Update your persona</h2>
<h2 className="text-lg font-semibold">Tell us more about yourself</h2>
<p className="mt-1 text-sm text-balance text-gray-500">
Update your persona to get the best out of the AI Tutor.
We'll use this information to help you get the best out of the AI
Tutor.
</p>
</div>

18
src/components/UserPersona/UserPersonaForm.tsx
View File

@@ -1,6 +1,6 @@
import { useId, useRef, useState } from 'react';
import { SelectNative } from '../SelectNative';
import { Loader2Icon, MessageCircle, PlayIcon } from 'lucide-react';
import { Loader2Icon, MessageCircle } from 'lucide-react';
import { cn } from '../../lib/classname';
export type UserPersonaFormData = {
@@ -53,7 +53,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
id={expertiseFieldId}
value={expertise}
onChange={(e) => setExpertise(e.target.value)}
className="border-gray-300 focus:border-gray-500 focus:ring-1 focus:ring-gray-500"
className="border-gray-300 text-sm h-[40px] focus:border-gray-500 focus:ring-1 focus:ring-gray-500"
>
<option value="" selected hidden>
Select your expertise
@@ -77,7 +77,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
htmlFor={goalFieldId}
>
What is your goal?{' '}
{hasInitialGoal && !defaultValues?.goal && `Tell us more (optional)`}
{hasInitialGoal && !defaultValues?.goal && `Tell us more`}
</label>
{!hasInitialGoal && (
@@ -93,7 +93,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
].map((goalTemplate) => (
<button
key={goalTemplate}
className="rounded-lg border border-gray-200 bg-gray-50 px-4 py-2 text-sm text-gray-600 shadow-sm transition-all hover:border-gray-300 hover:bg-gray-100 hover:shadow"
className="rounded-lg border border-gray-200 bg-gray-50 px-4 py-2 text-sm text-gray-600 transition-all hover:border-gray-300 hover:bg-gray-100 hover:border-gray-400"
onClick={() => {
if (goalTemplate !== 'Other (tell us more)') {
setGoal(goalTemplate);
@@ -116,7 +116,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
ref={goalRef}
id={goalFieldId}
className={cn(
'block min-h-24 w-full resize-none rounded-lg border border-gray-300 bg-white px-4 py-3 text-sm shadow-sm outline-none placeholder:text-gray-400 focus:border-gray-500 focus:ring-1 focus:ring-gray-500',
'block min-h-24 w-full resize-none rounded-lg border border-gray-300 bg-white px-4 py-3 text-sm outline-none placeholder:text-gray-400 focus:border-gray-500 focus:ring-1 focus:ring-gray-500',
!hasInitialGoal && 'hidden',
)}
placeholder={`e.g. need to find a job as soon as possible`}
@@ -135,7 +135,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
<input
id={commitFieldId}
className="block w-full resize-none rounded-lg border border-gray-300 bg-white px-4 py-3 text-sm shadow-sm outline-none placeholder:text-gray-400 focus:border-gray-500 focus:ring-1 focus:ring-gray-500"
className="block w-full resize-none rounded-lg border border-gray-300 bg-white px-4 h-[40px] text-sm outline-none placeholder:text-gray-400 focus:border-gray-500 focus:ring-1 focus:ring-gray-500"
placeholder="e.g. 10 hours per week"
value={commit}
onChange={(e) => setCommit(e.target.value)}
@@ -145,7 +145,7 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
<button
disabled={isLoading || !hasFormCompleted}
type="submit"
className="mt-6 flex h-11 w-full items-center justify-center gap-2 rounded-lg bg-black px-6 py-2 text-sm text-white shadow-sm transition-all hover:bg-gray-900 disabled:pointer-events-none disabled:opacity-50"
className="mt-6 flex h-11 w-full items-center justify-center gap-2 rounded-lg bg-black px-6 py-2 text-sm text-white transition-all hover:bg-gray-900 disabled:pointer-events-none disabled:opacity-50"
>
{isLoading ? (
<Loader2Icon className="size-4 animate-spin stroke-[2.5]" />
@@ -153,8 +153,8 @@ export function UserPersonaForm(props: UserPersonaFormProps) {
<>
{defaultValues ? (
<>
<PlayIcon className="size-4" />
Update Persona
<MessageCircle className="size-4" />
Update Information
</>
) : (
<>