@@ -14,8 +14,10 @@ import { useEffect } from "react";
14
14
import { useAuthStore } from "@/lib/providers/auth-store-provider" ;
15
15
import { useCoachingRelationshipStateStore } from "@/lib/providers/coaching-relationship-state-store-provider" ;
16
16
import { useCoachingSessionStateStore } from "@/lib/providers/coaching-session-state-store-provider" ;
17
+ import { cn } from "../lib/utils" ;
17
18
18
19
interface CoachingRelationshipsSelectorProps extends PopoverProps {
20
+ className ?: string ;
19
21
/// The Organization's Id for which to get a list of associated CoachingRelationships
20
22
organizationId : Id ;
21
23
/// Disable the component from interaction with the user
@@ -38,18 +40,13 @@ function CoachingRelationshipsSelectItems({
38
40
// Be sure to cache the list of current coaching relationships in the CoachingRelationshipStateStore
39
41
useEffect ( ( ) => {
40
42
if ( ! relationships . length ) return ;
41
- console . debug (
42
- `relationships (useEffect): ${ JSON . stringify ( relationships ) } `
43
- ) ;
44
43
setCurrentCoachingRelationships ( relationships ) ;
45
44
} , [ relationships , setCurrentCoachingRelationships ] ) ;
46
45
47
46
if ( isLoading ) return < div > Loading...</ div > ;
48
47
if ( isError ) return < div > Error loading coaching relationships</ div > ;
49
48
if ( ! relationships ?. length ) return < div > No coaching relationships found</ div > ;
50
49
51
- console . debug ( `relationships: ${ JSON . stringify ( relationships ) } ` ) ;
52
-
53
50
return (
54
51
< >
55
52
{ relationships . map ( ( rel ) => (
@@ -63,6 +60,7 @@ function CoachingRelationshipsSelectItems({
63
60
}
64
61
65
62
export default function CoachingRelationshipSelector ( {
63
+ className,
66
64
organizationId,
67
65
disabled,
68
66
onSelect,
@@ -101,29 +99,32 @@ export default function CoachingRelationshipSelector({
101
99
? getCurrentCoachingRelationship ( currentCoachingRelationshipId )
102
100
: null ;
103
101
104
- const displayValue = currentRelationship ? (
105
- < >
106
- { currentRelationship . coach_first_name } { " " }
107
- { currentRelationship . coach_last_name } ->{ " " }
108
- { currentRelationship . coachee_first_name } { " " }
109
- { currentRelationship . coachee_last_name }
110
- </ >
111
- ) : undefined ;
102
+ const displayValue =
103
+ currentRelationship && currentRelationship . id ? (
104
+ < >
105
+ { currentRelationship . coach_first_name } { " " }
106
+ { currentRelationship . coach_last_name } ->{ " " }
107
+ { currentRelationship . coachee_first_name } { " " }
108
+ { currentRelationship . coachee_last_name }
109
+ </ >
110
+ ) : undefined ;
112
111
113
112
return (
114
- < Select
115
- disabled = { disabled }
116
- value = { currentCoachingRelationshipId ?? undefined }
117
- onValueChange = { handleSetCoachingRelationship }
118
- >
119
- < SelectTrigger id = "coaching-relationship-selector" >
120
- < SelectValue placeholder = "Select coaching relationship" >
121
- { displayValue }
122
- </ SelectValue >
123
- </ SelectTrigger >
124
- < SelectContent >
125
- < CoachingRelationshipsSelectItems organizationId = { organizationId } />
126
- </ SelectContent >
127
- </ Select >
113
+ < div className = { cn ( "font-normal" , className ) } >
114
+ < Select
115
+ disabled = { disabled }
116
+ value = { currentCoachingRelationshipId ?? undefined }
117
+ onValueChange = { handleSetCoachingRelationship }
118
+ >
119
+ < SelectTrigger id = "coaching-relationship-selector" >
120
+ < SelectValue placeholder = "Select coaching relationship" >
121
+ { displayValue }
122
+ </ SelectValue >
123
+ </ SelectTrigger >
124
+ < SelectContent >
125
+ < CoachingRelationshipsSelectItems organizationId = { organizationId } />
126
+ </ SelectContent >
127
+ </ Select >
128
+ </ div >
128
129
) ;
129
130
}
0 commit comments