Upload from GitHub Actions: Fix crashes when searching low-resource languages
Browse files- Add null checks for empty model arrays in HistoryPlot.js
- Fix array bounds checking in SpeakerPlot.js
- Improve UI styling for warning banner and GitHub link
Fixes issue where searching for languages like 'Erzya' crashed the app
when no AI models have been evaluated on that language yet.
    	
        frontend/src/App.js
    CHANGED
    
    | @@ -69,35 +69,50 @@ function App () { | |
| 69 | 
             
                      style={{
         | 
| 70 | 
             
                        backgroundColor: '#fff3cd',
         | 
| 71 | 
             
                        color: '#856404',
         | 
| 72 | 
            -
                        padding: ' | 
| 73 | 
             
                        marginBottom: '1rem',
         | 
| 74 | 
             
                        border: '1px solid #ffeeba',
         | 
| 75 | 
             
                        borderRadius: '0.25rem',
         | 
| 76 | 
            -
                        textAlign: 'center'
         | 
|  | |
|  | |
| 77 | 
             
                      }}
         | 
| 78 | 
             
                    >
         | 
| 79 | 
             
                      <strong>Work in Progress:</strong> This dashboard is currently under
         | 
| 80 | 
            -
                      active development. Evaluation results are not yet final.
         | 
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
| 81 | 
             
                      <a
         | 
| 82 | 
             
                        href='https://github.com/datenlabor-bmz/ai-language-monitor'
         | 
| 83 | 
             
                        target='_blank'
         | 
| 84 | 
             
                        rel='noopener noreferrer'
         | 
| 85 | 
             
                        style={{
         | 
| 86 | 
             
                          textDecoration: 'none',
         | 
| 87 | 
            -
                          color: '# | 
| 88 | 
            -
                           | 
| 89 | 
            -
                           | 
| 90 | 
            -
                           | 
| 91 | 
            -
                           | 
| 92 | 
            -
                           | 
| 93 | 
            -
                           | 
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
| 94 | 
             
                        }}
         | 
| 95 | 
             
                      >
         | 
| 96 | 
            -
                        <i
         | 
| 97 | 
            -
                          className='pi pi-github'
         | 
| 98 | 
            -
                          title='View on GitHub'
         | 
| 99 | 
            -
                          style={{ marginRight: '0.3rem' }}
         | 
| 100 | 
            -
                        />
         | 
| 101 | 
             
                        GitHub
         | 
| 102 | 
             
                      </a>
         | 
| 103 | 
             
                    </div>
         | 
|  | |
| 69 | 
             
                      style={{
         | 
| 70 | 
             
                        backgroundColor: '#fff3cd',
         | 
| 71 | 
             
                        color: '#856404',
         | 
| 72 | 
            +
                        padding: '1rem 1.5rem',
         | 
| 73 | 
             
                        marginBottom: '1rem',
         | 
| 74 | 
             
                        border: '1px solid #ffeeba',
         | 
| 75 | 
             
                        borderRadius: '0.25rem',
         | 
| 76 | 
            +
                        textAlign: 'center',
         | 
| 77 | 
            +
                        lineHeight: '1.5',
         | 
| 78 | 
            +
                        position: 'relative'
         | 
| 79 | 
             
                      }}
         | 
| 80 | 
             
                    >
         | 
| 81 | 
             
                      <strong>Work in Progress:</strong> This dashboard is currently under
         | 
| 82 | 
            +
                      active development. Evaluation results are not yet final. Note that the visualised results currently stem from sampling 10 instances per combination of model, task, and language. More extensive evaluation runs will be released later this year.
         | 
| 83 | 
            +
                    </div>
         | 
| 84 | 
            +
                    <div
         | 
| 85 | 
            +
                      style={{
         | 
| 86 | 
            +
                        display: 'flex',
         | 
| 87 | 
            +
                        justifyContent: 'flex-end',
         | 
| 88 | 
            +
                        padding: '0 1.5rem',
         | 
| 89 | 
            +
                        marginBottom: '1rem'
         | 
| 90 | 
            +
                      }}
         | 
| 91 | 
            +
                    >
         | 
| 92 | 
             
                      <a
         | 
| 93 | 
             
                        href='https://github.com/datenlabor-bmz/ai-language-monitor'
         | 
| 94 | 
             
                        target='_blank'
         | 
| 95 | 
             
                        rel='noopener noreferrer'
         | 
| 96 | 
             
                        style={{
         | 
| 97 | 
             
                          textDecoration: 'none',
         | 
| 98 | 
            +
                          color: '#6c757d',
         | 
| 99 | 
            +
                          fontSize: '1rem',
         | 
| 100 | 
            +
                          fontWeight: '500',
         | 
| 101 | 
            +
                          padding: '0.5rem 1rem',
         | 
| 102 | 
            +
                          borderRadius: '0.375rem',
         | 
| 103 | 
            +
                          backgroundColor: '#f8f9fa',
         | 
| 104 | 
            +
                          border: '1px solid #e9ecef',
         | 
| 105 | 
            +
                          display: 'flex',
         | 
| 106 | 
            +
                          alignItems: 'center',
         | 
| 107 | 
            +
                          gap: '0.5rem',
         | 
| 108 | 
            +
                          transition: 'all 0.2s ease',
         | 
| 109 | 
            +
                          ':hover': {
         | 
| 110 | 
            +
                            backgroundColor: '#e9ecef',
         | 
| 111 | 
            +
                            color: '#495057'
         | 
| 112 | 
            +
                          }
         | 
| 113 | 
             
                        }}
         | 
| 114 | 
             
                      >
         | 
| 115 | 
            +
                        <i className='pi pi-github' title='View on GitHub' />
         | 
|  | |
|  | |
|  | |
|  | |
| 116 | 
             
                        GitHub
         | 
| 117 | 
             
                      </a>
         | 
| 118 | 
             
                    </div>
         | 
    	
        frontend/src/components/HistoryPlot.js
    CHANGED
    
    | @@ -50,12 +50,12 @@ const HistoryPlot = ({ data, width = 750, height = 500 }) => { | |
| 50 | 
             
                        ...models.filter(d => d.newRecord),
         | 
| 51 | 
             
                        {
         | 
| 52 | 
             
                          creation_date: new Date(),
         | 
| 53 | 
            -
                          maxAverage: models[models.length - 1] | 
| 54 | 
             
                        }
         | 
| 55 | 
             
                      ],
         | 
| 56 | 
             
                      {
         | 
| 57 | 
             
                        x: d => d.creation_date,
         | 
| 58 | 
            -
                        y: d => d.maxAverage,
         | 
| 59 | 
             
                        curve: 'step-after',
         | 
| 60 | 
             
                        strokeOpacity: 0.3
         | 
| 61 | 
             
                      }
         | 
|  | |
| 50 | 
             
                        ...models.filter(d => d.newRecord),
         | 
| 51 | 
             
                        {
         | 
| 52 | 
             
                          creation_date: new Date(),
         | 
| 53 | 
            +
                          maxAverage: models[models.length - 1]?.maxAverage || 0
         | 
| 54 | 
             
                        }
         | 
| 55 | 
             
                      ],
         | 
| 56 | 
             
                      {
         | 
| 57 | 
             
                        x: d => d.creation_date,
         | 
| 58 | 
            +
                        y: d => d.maxAverage || 0,
         | 
| 59 | 
             
                        curve: 'step-after',
         | 
| 60 | 
             
                        strokeOpacity: 0.3
         | 
| 61 | 
             
                      }
         | 
    	
        frontend/src/components/SpeakerPlot.js
    CHANGED
    
    | @@ -73,10 +73,10 @@ const SpeakerPlot = ({ data, width = 750, height = 500 }) => { | |
| 73 | 
             
                      textStrokeOpacity: 0,
         | 
| 74 | 
             
                      textFillOpacity: 0
         | 
| 75 | 
             
                    }),
         | 
| 76 | 
            -
                    Plot.tip(['The 40 most spoken languages cover 80% of all speakers.'], {
         | 
| 77 | 
             
                      x: 40,
         | 
| 78 | 
             
                      y: languages[39].cumSpeakers / 1e6
         | 
| 79 | 
            -
                    })
         | 
| 80 | 
             
                  ]
         | 
| 81 | 
             
                })
         | 
| 82 | 
             
                containerRef.current.append(plot)
         | 
|  | |
| 73 | 
             
                      textStrokeOpacity: 0,
         | 
| 74 | 
             
                      textFillOpacity: 0
         | 
| 75 | 
             
                    }),
         | 
| 76 | 
            +
                    ...(languages.length >= 40 ? [Plot.tip(['The 40 most spoken languages cover 80% of all speakers.'], {
         | 
| 77 | 
             
                      x: 40,
         | 
| 78 | 
             
                      y: languages[39].cumSpeakers / 1e6
         | 
| 79 | 
            +
                    })] : [])
         | 
| 80 | 
             
                  ]
         | 
| 81 | 
             
                })
         | 
| 82 | 
             
                containerRef.current.append(plot)
         | 

