Näytä kaikki extended essay -kentät

Opetushallitus · Jan 10, 2025 · ea97669 · ea97669
1 parent 84a7d61
commit ea97669
Showing 1 changed file with 79 additions and 52 deletions.
diff --git a/web/app/ib/IBPaatasonSuoritusTiedot.tsx b/web/app/ib/IBPaatasonSuoritusTiedot.tsx
@@ -273,91 +273,118 @@ const ExtendedEssayFieldRows: React.FC<IBTutkinnonTiedotRowsProps> = ({
   const ryhmät = useAineryhmäOptions(true)
   const tasot = useOppiaineTasoOptions(true)
 
-  return form.editMode ? (
+  return (
     <>
       <KeyValueRow localizableLabel="Extended essay">
         <KeyValueTable>
           {state.tunniste.visible && tunnisteet && (
-            <KeyValueRow localizableLabel="Tunniste" innerKeyValueTable>
-              <Select
-                inlineOptions
-                options={tunnisteet}
-                value={
-                  state.tunniste.value && koodiviiteId(state.tunniste.value)
-                }
-                onChange={(opt) => state.tunniste.set(opt?.value)}
-                testId="tunniste"
-              />
+            <KeyValueRow localizableLabel="Oppiaine" innerKeyValueTable>
+              {form.editMode ? (
+                <Select
+                  inlineOptions
+                  options={tunnisteet}
+                  value={
+                    state.tunniste.value && koodiviiteId(state.tunniste.value)
+                  }
+                  onChange={(opt) => state.tunniste.set(opt?.value)}
+                  testId="tunniste"
+                />
+              ) : (
+                t(state.tunniste.value?.nimi)
+              )}
             </KeyValueRow>
           )}
           {state.kieli.visible && kielet && (
             <KeyValueRow localizableLabel="Kieli" innerKeyValueTable>
-              <DialogSelect
-                options={kielet}
-                value={state.kieli.value && koodiviiteId(state.kieli.value)}
-                onChange={(o) => state.kieli.set(o?.value)}
-                testId="kieli"
-              />
+              {form.editMode ? (
+                <DialogSelect
+                  options={kielet}
+                  value={state.kieli.value && koodiviiteId(state.kieli.value)}
+                  onChange={(o) => state.kieli.set(o?.value)}
+                  testId="kieli"
+                />
+              ) : (
+                t(state.kieli?.value?.nimi)
+              )}
             </KeyValueRow>
           )}
           {state.taso.visible && tasot && (
             <KeyValueRow localizableLabel="Taso" innerKeyValueTable>
-              <DialogSelect
-                options={tasot}
-                value={state.taso.value && koodiviiteId(state.taso.value)}
-                onChange={(o) => state.taso.set(o?.value)}
-                testId="taso"
-              />
+              {form.editMode ? (
+                <DialogSelect
+                  options={tasot}
+                  value={state.taso.value && koodiviiteId(state.taso.value)}
+                  onChange={(o) => state.taso.set(o?.value)}
+                  testId="taso"
+                />
+              ) : (
+                t(state.taso.value?.nimi)
+              )}
             </KeyValueRow>
           )}
           {state.ryhmä.visible && ryhmät && (
             <KeyValueRow localizableLabel="Aineryhmä" innerKeyValueTable>
-              <DialogSelect
-                options={ryhmät}
-                value={state.ryhmä.value && koodiviiteId(state.ryhmä.value)}
-                onChange={(o) => state.ryhmä.set(o?.value)}
-                testId="ryhmä"
-              />
+              {form.editMode ? (
+                <DialogSelect
+                  options={ryhmät}
+                  value={state.ryhmä.value && koodiviiteId(state.ryhmä.value)}
+                  onChange={(o) => state.ryhmä.set(o?.value)}
+                  testId="ryhmä"
+                />
+              ) : (
+                t(state.ryhmä.value?.nimi)
+              )}
             </KeyValueRow>
           )}
           {state.pakollinen.visible && (
             <KeyValueRow innerKeyValueTable>
-              <Checkbox
-                label={t('Pakollinen')}
-                checked={!!state.pakollinen.value}
-                onChange={state.pakollinen.set}
-                testId="pakollinen"
-              />
+              {form.editMode ? (
+                <Checkbox
+                  label={t('Pakollinen')}
+                  checked={!!state.pakollinen.value}
+                  onChange={state.pakollinen.set}
+                  testId="pakollinen"
+                />
+              ) : state.pakollinen ? (
+                t('Pakollinen')
+              ) : (
+                t('Valinnainen')
+              )}
             </KeyValueRow>
           )}
         </KeyValueTable>
         {state.aihe.visible && (
           <KeyValueRow localizableLabel="Aihe" innerKeyValueTable>
-            <LocalizedTextEdit
-              value={state.aihe.value}
-              onChange={state.aihe.set}
-            />
+            {form.editMode ? (
+              <LocalizedTextEdit
+                value={state.aihe.value}
+                onChange={state.aihe.set}
+              />
+            ) : (
+              t(state.aihe.value)
+            )}
           </KeyValueRow>
         )}
         {state.arvosana.visible && (
           <KeyValueRow localizableLabel="Arvosana" innerKeyValueTable>
-            <KoodistoSelect
-              koodistoUri="arviointiasteikkocorerequirementsib"
-              value={state.arvosana.value?.koodiarvo}
-              format={koodiarvoAndNimi}
-              onSelect={state.arvosana.set}
-              testId="arvosana"
-            />
+            {form.editMode ? (
+              <KoodistoSelect
+                koodistoUri="arviointiasteikkocorerequirementsib"
+                value={state.arvosana.value?.koodiarvo}
+                format={koodiarvoAndNimi}
+                onSelect={state.arvosana.set}
+                testId="arvosana"
+              />
+            ) : (
+              <>
+                {state.arvosana.value?.koodiarvo}{' '}
+                {t(state.arvosana.value?.nimi)}
+              </>
+            )}
           </KeyValueRow>
         )}
       </KeyValueRow>
     </>
-  ) : (
-    <KeyValueRow localizableLabel="Extended essay">
-      <TestIdText id="extendedEssay">
-        {parasArvosana(päätasonSuoritus.suoritus.extendedEssay?.arviointi)}
-      </TestIdText>
-    </KeyValueRow>
   )
 }