1- import type { BlueprintType } from '@/api-types' ;
1+ import type { BlueprintType , PhasicBlueprint } from '@/api-types' ;
22import clsx from 'clsx' ;
33import { Markdown } from './messages' ;
44
5+ const isPhasicBlueprint = ( blueprint : BlueprintType ) : blueprint is PhasicBlueprint =>
6+ 'views' in blueprint ;
7+
58export function Blueprint ( {
69 blueprint,
710 className,
@@ -11,6 +14,8 @@ export function Blueprint({
1114} ) {
1215 if ( ! blueprint ) return null ;
1316
17+ const phasicBlueprint = isPhasicBlueprint ( blueprint ) ? blueprint : null ;
18+
1419 return (
1520 < div className = { clsx ( 'w-full flex flex-col' , className ) } { ...props } >
1621 < div className = "bg-accent p-6 rounded-t-xl flex items-center bg-graph-paper" >
@@ -84,13 +89,13 @@ export function Blueprint({
8489 </ div >
8590
8691 { /* Views */ }
87- { Array . isArray ( blueprint . views ) && blueprint . views . length > 0 && (
92+ { phasicBlueprint && phasicBlueprint . views . length > 0 && (
8893 < div >
8994 < h3 className = "text-sm font-medium mb-3 text-text-50/70 uppercase tracking-wider" >
9095 Views
9196 </ h3 >
9297 < div className = "space-y-3" >
93- { blueprint . views . map ( ( view , index ) => (
98+ { phasicBlueprint . views . map ( ( view , index ) => (
9499 < div key = { `view-${ index } ` } className = "space-y-1" >
95100 < h4 className = "text-xs font-medium text-text-50/70" >
96101 { view . name }
@@ -105,41 +110,41 @@ export function Blueprint({
105110 ) }
106111
107112 { /* User Flow */ }
108- { blueprint . userFlow && (
113+ { phasicBlueprint ? .userFlow && (
109114 < div >
110115 < h3 className = "text-sm font-medium mb-3 text-text-50/70 uppercase tracking-wider" >
111116 User Flow
112117 </ h3 >
113118 < div className = "space-y-4" >
114- { blueprint . userFlow ? .uiLayout && (
119+ { phasicBlueprint . userFlow . uiLayout && (
115120 < div >
116121 < h4 className = "text-xs font-medium mb-2 text-text-50/70" >
117122 UI Layout
118123 </ h4 >
119124 < Markdown className = "text-sm text-text-50" >
120- { blueprint . userFlow . uiLayout }
125+ { phasicBlueprint . userFlow . uiLayout }
121126 </ Markdown >
122127 </ div >
123128 ) }
124129
125- { blueprint . userFlow ? .uiDesign && (
130+ { phasicBlueprint . userFlow . uiDesign && (
126131 < div >
127132 < h4 className = "text-xs font-medium mb-2 text-text-50/70" >
128133 UI Design
129134 </ h4 >
130135 < Markdown className = "text-sm text-text-50" >
131- { blueprint . userFlow . uiDesign }
136+ { phasicBlueprint . userFlow . uiDesign }
132137 </ Markdown >
133138 </ div >
134139 ) }
135140
136- { blueprint . userFlow ? .userJourney && (
141+ { phasicBlueprint . userFlow . userJourney && (
137142 < div >
138143 < h4 className = "text-xs font-medium mb-2 text-text-50/70" >
139144 User Journey
140145 </ h4 >
141146 < Markdown className = "text-sm text-text-50" >
142- { blueprint . userFlow ? .userJourney }
147+ { phasicBlueprint . userFlow . userJourney }
143148 </ Markdown >
144149 </ div >
145150 ) }
@@ -148,25 +153,25 @@ export function Blueprint({
148153 ) }
149154
150155 { /* Data Flow */ }
151- { ( blueprint . dataFlow || blueprint . architecture ?. dataFlow ) && (
156+ { phasicBlueprint && ( phasicBlueprint . dataFlow || phasicBlueprint . architecture ?. dataFlow ) && (
152157 < div >
153158 < h3 className = "text-sm font-medium mb-2 text-text-50/70 uppercase tracking-wider" >
154159 Data Flow
155160 </ h3 >
156161 < Markdown className = "text-sm text-text-50" >
157- { blueprint . dataFlow || blueprint . architecture ?. dataFlow }
162+ { phasicBlueprint . dataFlow || phasicBlueprint . architecture ?. dataFlow }
158163 </ Markdown >
159164 </ div >
160165 ) }
161166
162167 { /* Implementation Roadmap */ }
163- { Array . isArray ( blueprint . implementationRoadmap ) && blueprint . implementationRoadmap . length > 0 && (
168+ { phasicBlueprint && phasicBlueprint . implementationRoadmap . length > 0 && (
164169 < div >
165170 < h3 className = "text-sm font-medium mb-2 text-text-50/70 uppercase tracking-wider" >
166171 Implementation Roadmap
167172 </ h3 >
168173 < div className = "space-y-3" >
169- { blueprint . implementationRoadmap . map ( ( roadmapItem , index ) => (
174+ { phasicBlueprint . implementationRoadmap . map ( ( roadmapItem , index ) => (
170175 < div key = { `roadmap-${ index } ` } className = "space-y-1" >
171176 < h4 className = "text-xs font-medium text-text-50/70" >
172177 Phase { index + 1 } : { roadmapItem . phase }
@@ -181,26 +186,26 @@ export function Blueprint({
181186 ) }
182187
183188 { /* Initial Phase */ }
184- { blueprint . initialPhase && (
189+ { phasicBlueprint ? .initialPhase && (
185190 < div >
186191 < h3 className = "text-sm font-medium mb-2 text-text-50/70 uppercase tracking-wider" >
187192 Initial Phase
188193 </ h3 >
189194 < div className = "space-y-3" >
190195 < div >
191196 < h4 className = "text-xs font-medium mb-2 text-text-50/70" >
192- { blueprint . initialPhase . name }
197+ { phasicBlueprint . initialPhase . name }
193198 </ h4 >
194199 < Markdown className = "text-sm text-text-50 mb-3" >
195- { blueprint . initialPhase . description }
200+ { phasicBlueprint . initialPhase . description }
196201 </ Markdown >
197- { Array . isArray ( blueprint . initialPhase . files ) && blueprint . initialPhase . files . length > 0 && (
202+ { Array . isArray ( phasicBlueprint . initialPhase . files ) && phasicBlueprint . initialPhase . files . length > 0 && (
198203 < div >
199204 < h5 className = "text-xs font-medium mb-2 text-text-50/60" >
200205 Files to be created:
201206 </ h5 >
202207 < div className = "space-y-2" >
203- { blueprint . initialPhase . files . map ( ( file , fileIndex ) => (
208+ { phasicBlueprint . initialPhase . files . map ( ( file , fileIndex ) => (
204209 < div key = { `initial-phase-file-${ fileIndex } ` } className = "border-l-2 border-text/10 pl-3" >
205210 < div className = "font-mono text-xs text-text-50/80" > { file . path } </ div >
206211 < div className = "text-xs text-text-50/60" > { file . purpose } </ div >
@@ -215,14 +220,14 @@ export function Blueprint({
215220 ) }
216221
217222 { /* Pitfalls */ }
218- { Array . isArray ( blueprint . pitfalls ) && blueprint . pitfalls . length > 0 && (
223+ { phasicBlueprint && phasicBlueprint . pitfalls . length > 0 && (
219224 < div >
220225 < h3 className = "text-sm font-medium mb-2 text-text-50/70 uppercase tracking-wider" >
221226 Pitfalls
222227 </ h3 >
223228 < div className = "prose prose-sm prose-invert" >
224229 < ul className = "" >
225- { blueprint . pitfalls ? .map ( ( pitfall , index ) => (
230+ { phasicBlueprint . pitfalls . map ( ( pitfall , index ) => (
226231 < li key = { `pitfall-${ index } ` } className = "" >
227232 { pitfall }
228233 </ li >
0 commit comments