@@ -380,3 +380,92 @@ function AmendmentBadge(props: { amendment: Amendment }) {
380380
381381 return < img src = { badgeUrl } alt = { status } className = "shield" /> ;
382382}
383+
384+ export function AmendmentDisclaimer ( props : {
385+ name : string ,
386+ } ) {
387+ const [ amendmentStatus , setStatus ] = React . useState < Amendment | null > ( null ) ;
388+ const [ loading , setLoading ] = React . useState ( true ) ;
389+ const [ error , setError ] = React . useState < string | null > ( null ) ;
390+ const { useTranslate } = useThemeHooks ( ) ;
391+ const { translate } = useTranslate ( ) ;
392+
393+ const link = ( ) => < Link to = { `/resources/known-amendments#${ props . name . toLowerCase ( ) } ` } > { props . name } amendment</ Link >
394+
395+ React . useEffect ( ( ) => {
396+ const fetchAmendments = async ( ) => {
397+ try {
398+ setLoading ( true ) ;
399+ const response = await fetch ( `https://vhs.prod.ripplex.io/v1/network/amendments/vote/main/` ) ;
400+ if ( ! response . ok ) {
401+ throw new Error ( `HTTP error! status: ${ response . status } ` ) ;
402+ }
403+ const data : AmendmentsResponse = await response . json ( )
404+ console . log ( "data.amendments is:" , data . amendments )
405+
406+ let found_amendment = false
407+ for ( const amendment of data . amendments ) {
408+ if ( amendment . name == props . name ) {
409+ setStatus ( amendment )
410+ found_amendment = true
411+ break
412+ }
413+ }
414+ if ( ! found_amendment ) {
415+ throw new Error ( `Couldn't find ${ props . name } amendment in status table.` )
416+ }
417+ } catch ( err ) {
418+ setError ( err instanceof Error ? err . message : 'Failed to fetch amendments' ) ;
419+ } finally {
420+ setLoading ( false )
421+ }
422+ }
423+ fetchAmendments ( )
424+ } , [ ] )
425+
426+ if ( loading ) {
427+ return (
428+ < p > < em >
429+ { translate ( "component.amendment-status.requires.1" , "Requires the " ) } { link ( ) } { translate ( "component.amendment-status.requires.2" , "." ) }
430+ { " " }
431+ < span className = "spinner-border text-primary" role = "status" >
432+ < span className = "sr-only" > { translate ( "amendment.loading_status" , "Loading..." ) } </ span >
433+ </ span >
434+ </ em > </ p >
435+ )
436+ }
437+
438+ if ( error ) {
439+ return (
440+ < p > < em >
441+ { translate ( "component.amendment-status.requires.1" , "Requires the " ) } { link ( ) } { translate ( "component.amendment-status.requires.2" , "." ) }
442+ { " " }
443+ < span className = "alert alert-danger" style = { { display : "block" } } >
444+ < strong > { translate ( "amendment.error_status" , "Error loading amendment status" ) } :</ strong > { error }
445+ </ span >
446+ </ em > </ p >
447+ )
448+ }
449+
450+ return (
451+ < p > < em > (
452+ {
453+ amendmentStatus . date ? (
454+ < >
455+ { translate ( "component.amendment-status.added.1" , "Added by the " ) } { link ( ) }
456+ { translate ( "component.amendment-status.added.2" , "." ) }
457+ { " " }
458+ < AmendmentBadge amendment = { amendmentStatus } />
459+ </ >
460+ ) : (
461+ < >
462+ { translate ( "component.amendment-status.requires.1" , "Requires the " ) } { link ( ) }
463+ { translate ( "component.amendment-status.requires.2" , "." ) }
464+ { " " }
465+ < AmendmentBadge amendment = { amendmentStatus } />
466+ </ >
467+ )
468+ }
469+ )</ em > </ p >
470+ )
471+ }
0 commit comments