diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/DateInput.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/DateInput.tsx
index 9986dff47ff..da236923f0d 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/DateInput.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/DateInput.tsx
@@ -6,6 +6,7 @@ import { Value } from 'react-date-picker/dist/cjs/shared/types';
 import 'react-date-picker/dist/DatePicker.css';
 import './css/React-Calendar.css';
 import './css/DateInput.css';
+import initialTranslations from '../config/initialTranslations.json';
 
 export interface DateInputProps {
     id?: string;
@@ -44,6 +45,7 @@ const DateInput: React.FC<DateInputProps> = (props) => {
         disableCalendar,
         translations
     } = props;
+    const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
     const globalSettings: SettingsType = useSelector((state: any) => state.fetchSettingsReducer.settings);
     const [dateFormat, setDateFormat] = useState<string | undefined>();
     const [inputValue, setInputValue] = useState<string | Date | undefined>(value);
@@ -97,9 +99,9 @@ const DateInput: React.FC<DateInputProps> = (props) => {
                 <DatePicker
                     id={id}
                     format={dateFormat}
-                    monthPlaceholder={translations["amp.indicatormanager:mm"]}
-                    dayPlaceholder={translations["amp.indicatormanager:dd"]}
-                    yearPlaceholder={translations["amp.indicatormanager:yyyy"]}
+                    monthPlaceholder={t("amp.indicatormanager:mm")}
+                    dayPlaceholder={t("amp.indicatormanager:dd")}
+                    yearPlaceholder={t("amp.indicatormanager:yyyy")}
                     className={className}
                     onChange={onChange}
                     name={name}
@@ -109,12 +111,12 @@ const DateInput: React.FC<DateInputProps> = (props) => {
                     defaultValue={defaultValue}
                     disabled={disabled}
                     clearIcon={clearIcon === null ? null : <ClearInputButton />}
-                    monthAriaLabel="Month"
-                    dayAriaLabel="Day"
-                    yearAriaLabel="Year"
+                    monthAriaLabel={t("amp.indicatormanager:aria-month")}
+                    dayAriaLabel={t("amp.indicatormanager:aria-day")}
+                    yearAriaLabel={t("amp.indicatormanager:aria-year")}
                     closeCalendar
-                    clearAriaLabel="Clear Date"
-                    calendarAriaLabel="Toggle Calendar"
+                    clearAriaLabel={t("amp.indicatormanager:aria-clear-date")}
+                    calendarAriaLabel={t("amp.indicatormanager:aria-toggle-calendar")}
                     inputRef={inputRef}
                     locale="en-US"
                     disableCalendar={disableCalendar}
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/AddNewIndicatorModal.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/AddNewIndicatorModal.tsx
index 9c8065cac4f..3dcf215280a 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/AddNewIndicatorModal.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/AddNewIndicatorModal.tsx
@@ -19,6 +19,7 @@ import lodash from 'lodash';
 import { getResponsibleOrgs } from '../../reducers/fetchResponsibleOrgsReducer';
 import axios from 'axios';
 import Accordion from 'react-bootstrap/Accordion';
+import initialTranslations from '../../config/initialTranslations.json';
 
 
 const MySwal = withReactContent(Swal);
@@ -74,10 +75,11 @@ interface IndicatorFormValues {
 
 const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
   const { show, setShow, translations } = props;
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
 
   const ascendingOptions = [
-    { value: true, label: translations["amp.indicatormanager:true"] },
-    { value: false, label: translations["amp.indicatormanager:false"] }
+    { value: true, label: t("amp.indicatormanager:true") },
+    { value: false, label: t("amp.indicatormanager:false") }
   ];
 
   const nodeRef = useRef(null);
@@ -246,7 +248,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
     if (createIndicatorState.loading) {
       MySwal.fire({
         icon: 'info',
-        title: `${translations["amp.indicatormanager:creating-indicator"]}...`,
+        title: `${t("amp.indicatormanager:creating-indicator")}...`,
         timer: 1000
       });
       return;
@@ -254,10 +256,10 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
 
     if (!createIndicatorState.loading && !createIndicatorState?.error && createIndicatorState?.createdIndicator?.id) {
       MySwal.fire({
-        title: translations["amp.indicatormanager:success"],
-        text: translations["amp.indicatormanager:save-success"],
+        title: t("amp.indicatormanager:success"),
+        text: t("amp.indicatormanager:save-success"),
         icon: 'success',
-        confirmButtonText: translations["amp.indicatormanager:ok"],
+        confirmButtonText: t("amp.indicatormanager:ok"),
       }).then(() => {
         dispatch(getIndicators());
         handleClose();
@@ -267,10 +269,10 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
 
     if (createIndicatorState.error && !createIndicatorState.loading && !createIndicatorState.createdIndicator) {
       MySwal.fire({
-        title: translations["amp.indicatormanager:error"],
-        text: createIndicatorState.loading ? translations["Error creating indicator"] : createIndicatorState.error,
+        title: t("amp.indicatormanager:error"),
+        text: createIndicatorState.loading ? t("Error creating indicator") : createIndicatorState.error,
         icon: 'error',
-        confirmButtonText: translations["amp.indicatormanager:ok"],
+        confirmButtonText: t("amp.indicatormanager:ok"),
       });
     }
 
@@ -339,7 +341,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
       size='lg'
     >
       <Modal.Header closeButton>
-        <Modal.Title>{translations['amp.dashboard:add-new']}</Modal.Title>
+        <Modal.Title>{t('amp.dashboard:add-new')}</Modal.Title>
       </Modal.Header>
       <Formik
         innerRef={formikRef}
@@ -349,10 +351,10 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
           const { name, description, code, sectors, programId, ascending, creationDate, base, target, indicatorsCategory } = values;
           if (selectedProgramSchemeId && !programId) {
             MySwal.fire({
-              title: translations['amp.indicatormanager:error'],
-              text: translations['amp.indicatormanager:errors-program-is-required'],
+              title: t('amp.indicatormanager:error'),
+              text: t('amp.indicatormanager:errors-program-is-required'),
               icon: 'error',
-              confirmButtonText: translations['amp.indicatormanager:ok'],
+              confirmButtonText: t('amp.indicatormanager:ok'),
             })
 
             return;
@@ -512,11 +514,11 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
               <Modal.Body>
                 <div className={styles.viewmodal_wrapper}>
                   {/* Core Indicator Information */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:core-info"]}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:core-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formBasicName">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-name"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-name")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
@@ -525,14 +527,14 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             isInvalid={!!props.errors.name}
                             required
                             aria-required type="text"
-                            placeholder={translations["amp.indicatormanager:enter-indicator-name"]}
+                            placeholder={t("amp.indicatormanager:enter-indicator-name")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.name && <span>{props.errors.name}</span>}
                         </Form.Control.Feedback>
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formIndicatorCode">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-code"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-code")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
@@ -540,7 +542,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             required
                             type="text"
                             className={`${styles.input_field} ${(props.errors.code && props.touched.code) && styles.text_is_invalid}`}
-                            placeholder={translations["amp.indicatormanager:enter-indicator-code"]}
+                            placeholder={t("amp.indicatormanager:enter-indicator-code")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.code && <span>{props.errors.code}</span>}
@@ -549,7 +551,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group as={Col} className={styles.view_one_item} controlId="formBasicDescription">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-description"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-description")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
@@ -557,7 +559,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             as="textarea"
                             rows={2}
                             className={`${styles.input_field} ${(props.errors.description && props.touched.description) && styles.text_is_invalid}`}
-                            placeholder={translations["amp.indicatormanager:enter-indicator-description"]}
+                            placeholder={t("amp.indicatormanager:enter-indicator-description")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.description && <span>{props.errors.description}</span>}
@@ -566,7 +568,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group as={Col} className={styles.view_one_item} controlId="formRelevanceForClimateChange">
-                        <Form.Label>{translations["amp.indicatormanager:relevance-for-climate-change"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:relevance-for-climate-change")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
@@ -574,13 +576,13 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             as="textarea"
                             rows={2}
                             className={styles.input_field}
-                            placeholder={translations["amp.indicatormanager:relevance-for-climate-change"]}
+                            placeholder={t("amp.indicatormanager:relevance-for-climate-change")}
                         />
                       </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formIndicatorType">
-                        <Form.Label>{translations["amp.indicatormanager:type"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:type")}</Form.Label>
                         <Select
                             name="indicatorType"
                             options={indicatorTypeOptions}
@@ -590,17 +592,18 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.indicatorType && props.touched.indicatorType) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-indicator-type")}
                             value={indicatorTypeOptions.find(opt => opt.value === props.values.indicatorType) || null}
                         />
                       </Form.Group>
                     </Row>
                   </div>
                   {/* Categorization and Linkage */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:categorization-linkage-info"] || "Categorization and Linkage"}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:categorization-linkage-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formOutcome">
-                        <Form.Label>{translations["amp.indicatormanager:outcome"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:outcome")}</Form.Label>
                         <Select
                             name="outcomeId"
                             options={allOutcomes.map(outcome => ({ value: outcome.id, label: outcome.name }))}
@@ -611,11 +614,12 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.outcomeId && props.touched.outcomeId) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-outcome")}
                             value={allOutcomes.find(outcome => outcome.id === selectedOutcomeId) ? { value: selectedOutcomeId, label: allOutcomes.find(outcome => outcome.id === selectedOutcomeId)?.name } : null}
                         />
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formOutput">
-                        <Form.Label>{translations["amp.indicatormanager:output"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:output")}</Form.Label>
                         <Select
                             name="outputId"
                             options={filteredOutputs.map(output => ({ value: output.id, label: output.name }))}
@@ -625,6 +629,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.outputId && props.touched.outputId) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-output")}
                             value={filteredOutputs.find(output => output.id === props.values.outputId) ? { value: props.values.outputId, label: filteredOutputs.find(output => output.id === props.values.outputId)?.name } : null}
                             isDisabled={!selectedOutcomeId}
                         />
@@ -632,7 +637,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="programScheme">
-                        <Form.Label>{translations["amp.indicatormanager:link-logframe"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:link-logframe")}</Form.Label>
                         <Select
                             name="programScheme"
                             options={programSchemes}
@@ -646,11 +651,12 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${styles.input_field}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-program-scheme")}
                         />
                       </Form.Group>
                       {programFieldVisible && (
                           <Form.Group className={styles.view_item} controlId="programs">
-                            <Form.Label>{translations["amp.indicatormanager:programs"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:programs")}</Form.Label>
                             <Select
                                 name="programs"
                                 options={programs}
@@ -662,13 +668,14 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                 onBlur={props.handleBlur}
                                 className={`basic-multi-select ${styles.input_field} ${(props.errors.programId && props.touched.programId) && styles.text_is_invalid}`}
                                 classNamePrefix="select"
+                                placeholder={t("amp.indicatormanager:select-program")}
                             />
                           </Form.Group>
                       )}
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_one_item} controlId="formIndicatorSectors">
-                        <Form.Label>{translations["amp.indicatormanager:sectors"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:sectors")}</Form.Label>
                         <Select
                             isMulti
                             name="sectors"
@@ -680,41 +687,42 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.sectors && props.touched.sectors) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-sectors")}
                         />
                       </Form.Group>
                     </Row>
                   </div>
                   {/* Data Definition and Sourcing */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:data-definition-sourcing-info"] || "Data Definition and Sourcing"}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:data-definition-sourcing-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formData">
-                        <Form.Label>{translations["amp.indicatormanager:data"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:data")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
                             name="data"
                             type="text"
                             className={styles.input_field}
-                            placeholder={translations["amp.indicatormanager:enter-data"]}
+                            placeholder={t("amp.indicatormanager:enter-data")}
                         />
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formDataSource">
-                        <Form.Label>{translations["amp.indicatormanager:data-source"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:data-source")}</Form.Label>
                         <Form.Control
                             onChange={props.handleChange}
                             onBlur={props.handleBlur}
                             name="dataSource"
                             type="text"
                             className={styles.input_field}
-                            placeholder={translations["amp.indicatormanager:enter-data-source"]}
+                            placeholder={t("amp.indicatormanager:enter-data-source")}
                         />
                       </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
 
                       <Form.Group className={styles.view_item} controlId="formUnitOfMeasure">
-                        <Form.Label>{translations["amp.indicatormanager:unit-of-measure"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:unit-of-measure")}</Form.Label>
                         <Select
                             name="unitOfMeasure"
                             options={unitOfMeasureOptions}
@@ -724,24 +732,25 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.unitOfMeasure && props.touched.unitOfMeasure) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-unit-of-measure")}
                             value={unitOfMeasureOptions.find(opt => opt.value === props.values.unitOfMeasure) || null}
                         />
                       </Form.Group>
                         <Form.Group className={styles.view_one_item} controlId="formCalculationMethod">
-                            <Form.Label>{translations["amp.indicatormanager:calculation-method"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:calculation-method")}</Form.Label>
                             <Form.Control
                                 onChange={props.handleChange}
                                 onBlur={props.handleBlur}
                                 name="calculationMethod"
                                 type="text"
                                 className={styles.input_field}
-                                placeholder={translations["amp.indicatormanager:calculation-method-placeholder"]}
+                                placeholder={t("amp.indicatormanager:calculation-method-placeholder")}
                             />
                         </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item} controlId="formDisaggregation">
-                            <Form.Label>{translations["amp.indicatormanager:disaggregation"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:disaggregation")}</Form.Label>
                             <Select
                               isMulti
                               name="disaggregation"
@@ -754,6 +763,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                               onBlur={props.handleBlur}
                               className={`basic-multi-select ${(props.errors.disaggregation && props.touched.disaggregation) && styles.text_is_invalid}`}
                               classNamePrefix="select"
+                              placeholder={t("amp.indicatormanager:select-disaggregation")}
                               value={disaggregationOptions.filter(opt => props.values.disaggregation?.includes(opt.value))}
                             />
                         </Form.Group>
@@ -763,7 +773,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                       <Row className={styles.view_row}>
                         <Col>
                           <div style={{marginTop: '1rem'}}>
-                            <h6>{translations["amp.indicatormanager:disaggregation-values"]}</h6>
+                            <h6>{t("amp.indicatormanager:disaggregation-values")}</h6>
                             <Accordion defaultActiveKey="0">
                               {props.values.disaggregation.map((parentId, parentIdx) => (
                                 <Card key={parentId}>
@@ -772,7 +782,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                     eventKey={String(parentIdx)}
                                     className={styles.accordionHeader}
                                     style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', background: '#f7f7f7', fontWeight: 'bold' }}
-                                    aria-label={translations["amp.indicatormanager:click-to-expand-collapse"]}
+                                    aria-label={t("amp.indicatormanager:click-to-expand-collapse")}
                                   >
                                     <div className={styles.accordionHeaderTitle} style={{ flex: 1 }}>
                                       {disaggregationOptions.find(opt => opt.value === parentId)?.label || `Disaggregation ${parentId}`}
@@ -801,95 +811,95 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                                   <Card.Title className={styles.accordionChildTitle}>{child.value}</Card.Title>
                                                   <div style={{display: 'flex', flexWrap: 'wrap', gap: '32px'}}>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:base-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:base-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                     </div>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:target-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:target-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
@@ -902,7 +912,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                         </div>
                                       ) : (
                                         <div style={{color: '#888', padding: '1rem', textAlign: 'center', border: '1px solid #eee', borderRadius: '4px'}}>
-                                          {translations["amp.indicatormanager:no-disaggregation-children"]}
+                                          {t("amp.indicatormanager:no-disaggregation-children")}
                                         </div>
                                       )}
                                     </Card.Body>
@@ -918,7 +928,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                       <Row className={styles.view_row}>
                         <Col>
                           <div style={{marginTop: '1rem'}}>
-                            <h6>{translations["amp.indicatormanager:disaggregation-values"]}</h6>
+                            <h6>{t("amp.indicatormanager:disaggregation-values")}</h6>
                             <Accordion defaultActiveKey="0">
                               {disaggregationChildren[props.values.disaggregation[0]]?.map((parentChild: any, parentIdx: number) => (
                                 <Card key={parentChild.id}>
@@ -927,7 +937,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                     eventKey={String(parentIdx)}
                                     className={styles.accordionHeader}
                                     style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', background: '#f7f7f7', fontWeight: 'bold' }}
-                                    aria-label={translations["amp.indicatormanager:click-to-expand-collapse"]}
+                                    aria-label={t("amp.indicatormanager:click-to-expand-collapse")}
                                   >
                                     <div className={styles.accordionHeaderTitle} style={{ flex: 1 }}>
                                       {parentChild.value}
@@ -955,95 +965,95 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                                   <Card.Title className={styles.accordionChildTitle}>{child.value}</Card.Title>
                                                   <div style={{display: 'flex', flexWrap: 'wrap', gap: '32px'}}>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:base-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:base-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['base', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                     </div>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:target-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:target-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx === -1 ? disaggArr.length : entryIdx, ['target', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
@@ -1056,7 +1066,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                                         </div>
                                       ) : (
                                         <div style={{color: '#888', padding: '1rem', textAlign: 'center', border: '1px solid #eee', borderRadius: '4px'}}>
-                                          {translations["amp.indicatormanager:no-disaggregation-children"]}
+                                          {t("amp.indicatormanager:no-disaggregation-children")}
                                         </div>
                                       )}
                                     </Card.Body>
@@ -1070,11 +1080,11 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     )}
                   </div>
                   {/* Responsibility and Frequency */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:responsibility-frequency-info"]}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:responsibility-frequency-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formResponsibleOrganizations">
-                        <Form.Label>{translations["amp.indicatormanager:responsible-organizations"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:responsible-organizations")}</Form.Label>
                         <Select
                             isMulti
                             name="responsibleOrganizations"
@@ -1085,11 +1095,12 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.responsibleOrganizations && props.touched.responsibleOrganizations) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-responsible-organizations")}
                             value={responsibleOrgOptions.filter(opt => props.values.responsibleOrganizations?.includes(opt.value))}
                         />
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formFrequency">
-                        <Form.Label>{translations["amp.indicatormanager:frequency"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:frequency")}</Form.Label>
                         <Select
                             name="frequency"
                             options={frequencyOptions}
@@ -1099,22 +1110,23 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.frequency && props.touched.frequency) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-frequency")}
                             value={frequencyOptions.find(opt => opt.value === props.values.frequency) || null}
                         />
                       </Form.Group>
                     </Row>
                   </div>
                   {/* Value Tracking */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:value-tracking"]}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:value-tracking")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Form.Group as={Col}>
                       <Form.Label>
-                        <h4>{translations["amp.indicatormanager:base-values"]}</h4>
+                        <h4>{t("amp.indicatormanager:base-values")}</h4>
                       </Form.Label>
                       {/* Original Value and Date in one row */}
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations['amp.indicatormanager:original-value']}</Form.Label>
+                          <Form.Label>{t('amp.indicatormanager:original-value')}</Form.Label>
                           <Form.Control
                               defaultValue={props.values.base?.originalValue}
                               onChange={props.handleChange}
@@ -1122,7 +1134,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                               name="base.originalValue"
                               type="number"
                               className={`${styles.input_field} ${(props.errors.base?.originalValue && props.touched.base?.originalValue) && styles.text_is_invalid}`}
-                              placeholder={translations["amp.indicatormanager:enter-original-value"]} />
+                              placeholder={t("amp.indicatormanager:enter-original-value")} />
 
                           <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                             {props.errors.base?.originalValue}
@@ -1130,7 +1142,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                         </Form.Group>
 
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                           <DateInput
                               translations={translations}
                               name="base.originalValueDate"
@@ -1155,7 +1167,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                       {/* Revised Value and Date in one row */}
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                           <Form.Control
                               defaultValue={props.values.base.revisedValue}
                               onChange={props.handleChange}
@@ -1163,7 +1175,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                               name="base.revisedValue"
                               type="number"
                               className={`${styles.input_field} ${(props.errors.base?.revisedValue && props.touched.base?.revisedValue) && styles.text_is_invalid}`}
-                              placeholder={translations["amp.indicatormanager:enter-revised-value"]} />
+                              placeholder={t("amp.indicatormanager:enter-revised-value")} />
 
                           <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                             {props.errors.base?.revisedValue}
@@ -1171,7 +1183,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                         </Form.Group>
 
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations['amp.indicatormanager:revised-value-date']}</Form.Label>
+                          <Form.Label>{t('amp.indicatormanager:revised-value-date')}</Form.Label>
                           <DateInput
                               translations={translations}
                               value={props.values.base.revisedValueDate}
@@ -1195,11 +1207,11 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     </Row>
                   </Form.Group>
                   <Form.Group as={Col}>
-                    <Form.Label><h4>{translations["amp.indicatormanager:target-values"]}</h4></Form.Label>
+                    <Form.Label><h4>{t("amp.indicatormanager:target-values")}</h4></Form.Label>
                     {/* Original Value and Date in one row */}
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item}>
-                        <Form.Label>{translations["amp.indicatormanager:target-value"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:target-value")}</Form.Label>
                         <Form.Control
                             defaultValue={props.values.target.originalValue}
                             onChange={props.handleChange}
@@ -1207,14 +1219,14 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             name="target.originalValue"
                             type="number"
                             className={`${styles.input_field} ${(props.errors.target?.originalValue && props.touched.target?.originalValue) && styles.text_is_invalid}`}
-                            placeholder={translations["amp.indicatormanager:enter-target-value"]} />
+                            placeholder={t("amp.indicatormanager:enter-target-value")} />
 
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.target?.originalValue}
                         </Form.Control.Feedback>
                       </Form.Group>
                       <Form.Group className={styles.view_item}>
-                        <Form.Label>{translations["amp.indicatormanager:target-value-date"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:target-value-date")}</Form.Label>
                         <DateInput translations={translations}
                                    name="target.originalValueDate"
                                    value={props.values.target.originalValueDate}
@@ -1238,7 +1250,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     {/* Revised Value and Date in one row */}
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item}>
-                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                         <Form.Control
                             defaultValue={props.values.target.revisedValue}
                             onChange={props.handleChange}
@@ -1246,7 +1258,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             name="target.revisedValue"
                             type="number"
                             className={`${styles.input_field} ${(props.errors.target?.revisedValue && props.touched.target?.revisedValue) && styles.text_is_invalid}`}
-                            placeholder={translations["amp.indicatormanager:enter-revised-value"]} />
+                            placeholder={t("amp.indicatormanager:enter-revised-value")} />
 
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.target?.revisedValue}
@@ -1254,7 +1266,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                       </Form.Group>
 
                       <Form.Group className={styles.view_item}>
-                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                         <DateInput
                             translations={translations}
                             value={props.values.target.revisedValueDate}
@@ -1278,11 +1290,11 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                     </Row>
                   </Form.Group>
                   {/* Other Considerations */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>Other Considerations</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:other-considerations")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="Ascending">
-                        <Form.Label>{translations["amp.indicatormanager:ascending"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:ascending")}</Form.Label>
                         <Select
                             name="ascending"
                             options={ascendingOptions}
@@ -1294,7 +1306,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                             }}
                             defaultValue={{
                               value: false,
-                              label: translations["amp.indicatormanager:true"]
+                              label: t("amp.indicatormanager:true")
                             }}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
@@ -1303,7 +1315,7 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
                       </Form.Group>
 
                       <Form.Group className={styles.view_item} controlId="formCreationDate">
-                        <Form.Label>{translations["amp.indicatormanager:table-header-creation-date"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:table-header-creation-date")}</Form.Label>
                         <DateInput
                             translations={translations}
                             name="creationDate"
@@ -1321,10 +1333,10 @@ const AddNewIndicatorModal: React.FC<AddNewIndicatorModalProps> = (props) => {
               </Modal.Body>
               <Modal.Footer>
                 <Button variant="secondary" onClick={handleClose}>
-                  {translations["amp.indicatormanager:close"]}
+                  {t("amp.indicatormanager:close")}
                 </Button>
                 <Button type="submit" variant="success" >
-                  {translations["amp.indicatormanager:save"]}
+                  {t("amp.indicatormanager:save")}
                 </Button>
               </Modal.Footer>
             </Form>
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/EditIndicatorModal.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/EditIndicatorModal.tsx
index 8930618fce6..916f1d7cb3b 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/EditIndicatorModal.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/EditIndicatorModal.tsx
@@ -20,6 +20,7 @@ import useDidMountEffect from '../../utils/hooks';
 import DateInput from '../DateInput';
 import lodash from 'lodash';
 import axios from 'axios';
+import initialTranslations from '../../config/initialTranslations.json';
 
 
 const MySwal = withReactContent(Swal);
@@ -76,10 +77,11 @@ interface IndicatorFormValues {
 
 const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
   const { show, setShow, indicator, translations, filterBySector, filterByProgram } = props;
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
 
   const ascendingOptions = [
-    { value: true, label: translations["amp.indicatormanager:true"] },
-    { value: false, label: translations["amp.indicatormanager:false"] }
+    { value: true, label: t("amp.indicatormanager:true") },
+    { value: false, label: t("amp.indicatormanager:false") }
   ];
 
   const dispatch = useDispatch();
@@ -250,7 +252,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
 
       return {
         value: sectorId.toString(),
-        label: translations["amp.indicatormanager:sector-not-found"]
+        label: t("amp.indicatormanager:sector-not-found")
       }
     });
 
@@ -318,7 +320,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
     if (updateIndicatorReducer.loading) {
       MySwal.fire({
         icon: 'info',
-        title: `${translations["amp.indicatormanager:updating-indicator"]}...`,
+        title: `${t("amp.indicatormanager:updating-indicator")}...`,
         timer: 18000
       });
       return;
@@ -327,7 +329,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
     if (!updateIndicatorReducer.loading && !updateIndicatorReducer.error && updateIndicatorReducer?.indicator?.id) {
       MySwal.fire({
         icon: 'success',
-        title: translations["amp.indicatormanager:indicator-updated-successfully"],
+        title: t("amp.indicatormanager:indicator-updated-successfully"),
         timer: 3000
       }).then(() => {
         handleClose();
@@ -338,8 +340,8 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
 
     MySwal.fire({
       icon: 'error',
-      title: translations["amp.indicatormanager:error"],
-      text: updateIndicatorReducer.loading ? translations["amp.indicatormanager:save-failed"] : updateIndicatorReducer.error,
+      title: t("amp.indicatormanager:error"),
+      text: updateIndicatorReducer.loading ? t("amp.indicatormanager:save-failed") : updateIndicatorReducer.error,
     });
   }, [updateIndicatorReducer]);
     const convertDisaggregationDatesToISO = (disaggregationValues: any[] = []) => {
@@ -448,7 +450,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
       size="lg"
     >
       <Modal.Header closeButton>
-        <Modal.Title>{translations["amp.indicatormanager:edit-indicator"]}</Modal.Title>
+        <Modal.Title>{t("amp.indicatormanager:edit-indicator")}</Modal.Title>
       </Modal.Header>
       <Formik
         initialValues={initialValues}
@@ -508,10 +510,10 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
 
           if (selectedProgramSchemeId && !values.programId) {
             MySwal.fire({
-              title: translations['amp.indicatormanager:error'],
-              text: translations['amp.indicatormanager:errors-program-is-required'],
+              title: t('amp.indicatormanager:error'),
+              text: t('amp.indicatormanager:errors-program-is-required'),
               icon: 'error',
-              confirmButtonText: translations['amp.indicatormanager:ok'],
+              confirmButtonText: t('amp.indicatormanager:ok'),
             })
             return;
           }
@@ -588,11 +590,11 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
               <Modal.Body>
                 <div className={styles.viewmodal_wrapper}>
                   {/* Core Indicator Information */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:core-info"]}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:core-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formBasicName">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-name"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-name")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.name}
                           onChange={props.handleChange}
@@ -602,14 +604,14 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           isInvalid={!!props.errors.name}
                           required
                           aria-required type="text"
-                          placeholder={translations["amp.indicatormanager:enter-indicator-name"]}
+                          placeholder={t("amp.indicatormanager:enter-indicator-name")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.name}
                         </Form.Control.Feedback>
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formIndicatorCode">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-code"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-code")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.code}
                           onChange={props.handleChange}
@@ -618,7 +620,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           required
                           type="text"
                           className={`${styles.input_field} ${(props.errors.code && props.touched.code) && styles.text_is_invalid}`}
-                          placeholder={translations["amp.indicatormanager:enter-indicator-code"]}
+                          placeholder={t("amp.indicatormanager:enter-indicator-code")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.code}
@@ -627,7 +629,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group as={Col} className={styles.view_one_item} controlId="formBasicDescription">
-                        <Form.Label>{translations["amp.indicatormanager:indicator-description"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:indicator-description")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.description}
                           onChange={props.handleChange}
@@ -636,7 +638,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           as="textarea"
                           rows={2}
                           className={`${styles.input_field} ${(props.errors.description && props.touched.description) && styles.text_is_invalid}`}
-                          placeholder={translations["amp.indicatormanager:enter-indicator-description"]}
+                          placeholder={t("amp.indicatormanager:enter-indicator-description")}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                           {props.errors.description}
@@ -645,7 +647,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group as={Col} className={styles.view_one_item} controlId="formRelevanceForClimateChange">
-                        <Form.Label>{translations["amp.indicatormanager:relevance-for-climate-change"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:relevance-for-climate-change")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.relevanceForClimateChange}
                           onChange={props.handleChange}
@@ -654,13 +656,13 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           as="textarea"
                           rows={2}
                           className={styles.input_field}
-                          placeholder={translations["amp.indicatormanager:relevance-for-climate-change"]}
+                          placeholder={t("amp.indicatormanager:relevance-for-climate-change")}
                         />
                       </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formIndicatorType">
-                        <Form.Label>{translations["amp.indicatormanager:type"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:type")}</Form.Label>
                         <Select
                           name="indicatorType"
                           options={indicatorTypeOptions}
@@ -670,17 +672,18 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${(props.errors.indicatorType && props.touched.indicatorType) && styles.text_is_invalid}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-indicator-type")}
                           value={indicatorTypeOptions.find(opt => opt.value === props.values.indicatorType) || null}
                         />
                       </Form.Group>
                     </Row>
                   </div>
                   {/* Categorization and Linkage */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:categorization-linkage-info"] || "Categorization and Linkage"}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:categorization-linkage-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formOutcome">
-                        <Form.Label>{translations["amp.indicatormanager:outcome"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:outcome")}</Form.Label>
                         <Select
                           name="outcomeId"
                           options={allOutcomes.map(outcome => ({ value: outcome.id, label: outcome.name }))}
@@ -691,11 +694,12 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${(props.errors.outcomeId && props.touched.outcomeId) && styles.text_is_invalid}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-outcome")}
                           value={allOutcomes.find(outcome => outcome.id === selectedOutcomeId) ? { value: selectedOutcomeId, label: allOutcomes.find(outcome => outcome.id === selectedOutcomeId)?.name } : null}
                         />
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formOutput">
-                        <Form.Label>{translations["amp.indicatormanager:output"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:output")}</Form.Label>
                         <Select
                           name="outputId"
                           options={filteredOutputs.map(output => ({ value: output.id, label: output.name }))}
@@ -705,6 +709,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${(props.errors.outputId && props.touched.outputId) && styles.text_is_invalid}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-output")}
                           value={filteredOutputs.find(output => output.id === props.values.outputId) ? { value: props.values.outputId, label: filteredOutputs.find(output => output.id === props.values.outputId)?.name } : null}
                           isDisabled={!selectedOutcomeId}
                         />
@@ -712,7 +717,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="programScheme">
-                        <Form.Label>{translations["amp.indicatormanager:link-logframe"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:link-logframe")}</Form.Label>
                         <Select
                           name="programScheme"
                           options={programSchemes}
@@ -727,12 +732,13 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${styles.input_field}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-program-scheme")}
                           value={defaultProgramScheme}
                         />
                       </Form.Group>
                       {programFieldVisible && (
                         <Form.Group className={styles.view_item} controlId="programs">
-                          <Form.Label>{translations["amp.indicatormanager:programs"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:programs")}</Form.Label>
                           <Select
                             name="programs"
                             options={programs}
@@ -744,6 +750,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${styles.input_field} ${(props.errors.programId && props.touched.programId) && styles.text_is_invalid}`}
                             classNamePrefix="select"
+                            placeholder={t("amp.indicatormanager:select-program")}
                             defaultValue={defaultProgram}
                           />
                         </Form.Group>
@@ -751,7 +758,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                     </Row>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_one_item} controlId="formIndicatorSectors">
-                        <Form.Label>{translations["amp.indicatormanager:sectors"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:sectors")}</Form.Label>
                         <Select
                           isMulti
                           name="sectors"
@@ -764,17 +771,18 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${(props.errors.sectors && props.touched.sectors) && styles.text_is_invalid}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-sectors")}
                           value={defaultSectors}
                         />
                       </Form.Group>
                     </Row>
                   </div>
                   {/* Data Definition and Sourcing */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:data-definition-sourcing-info"] || "Data Definition and Sourcing"}</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:data-definition-sourcing-info")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="formData">
-                        <Form.Label>{translations["amp.indicatormanager:data"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:data")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.data}
                           onChange={props.handleChange}
@@ -782,11 +790,11 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           name="data"
                           type="text"
                           className={styles.input_field}
-                          placeholder={translations["amp.indicatormanager:enter-data"]}
+                          placeholder={t("amp.indicatormanager:enter-data")}
                         />
                       </Form.Group>
                       <Form.Group className={styles.view_item} controlId="formDataSource">
-                        <Form.Label>{translations["amp.indicatormanager:data-source"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:data-source")}</Form.Label>
                         <Form.Control
                           defaultValue={props.values.dataSource}
                           onChange={props.handleChange}
@@ -794,14 +802,14 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           name="dataSource"
                           type="text"
                           className={styles.input_field}
-                          placeholder={translations["amp.indicatormanager:enter-data-source"]}
+                          placeholder={t("amp.indicatormanager:enter-data-source")}
                         />
                       </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
 
                       <Form.Group className={styles.view_item} controlId="formUnitOfMeasure">
-                        <Form.Label>{translations["amp.indicatormanager:unit-of-measure"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:unit-of-measure")}</Form.Label>
                         <Select
                           name="unitOfMeasure"
                           options={unitOfMeasureOptions}
@@ -811,12 +819,13 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           onBlur={props.handleBlur}
                           className={`basic-multi-select ${(props.errors.unitOfMeasure && props.touched.unitOfMeasure) && styles.text_is_invalid}`}
                           classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-unit-of-measure")}
                           value={unitOfMeasureOptions.find(opt => opt.value === props.values.unitOfMeasure) || null}
                         />
                       </Form.Group>
 
                         <Form.Group className={styles.view_one_item} controlId="formCalculationMethod">
-                            <Form.Label>{translations["amp.indicatormanager:calculation-method"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:calculation-method")}</Form.Label>
                             <Form.Control
                                 defaultValue={props.values.calculationMethod}
                                 onChange={props.handleChange}
@@ -824,14 +833,14 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                 name="calculationMethod"
                                 type="text"
                                 className={styles.input_field}
-                                placeholder={translations["amp.indicatormanager:calculation-method-placeholder"]}
+                                placeholder={t("amp.indicatormanager:calculation-method-placeholder")}
                         />
                         </Form.Group>
                     </Row>
                     <Row className={styles.view_row}>
 
                         <Form.Group className={styles.view_item} controlId="formDisaggregation">
-                            <Form.Label>{translations["amp.indicatormanager:disaggregation"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:disaggregation")}</Form.Label>
                             <Select
                                 isMulti
                                 name="disaggregation"
@@ -842,8 +851,9 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                 }}
                                 onBlur={props.handleBlur}
                                 className={`basic-multi-select ${(props.errors.disaggregation && props.touched.disaggregation) && styles.text_is_invalid}`}
-                                classNamePrefix="select"
-                                value={disaggregationOptions.filter(opt => props.values.disaggregation?.includes(opt.value))}
+                              classNamePrefix="select"
+                              placeholder={t("amp.indicatormanager:select-disaggregation")}
+                              value={disaggregationOptions.filter(opt => props.values.disaggregation?.includes(opt.value))}
                             />
                         </Form.Group>
                     </Row>
@@ -852,7 +862,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       <Row className={styles.view_row}>
                         <Col>
                           <div style={{marginTop: '1rem'}}>
-                            <h6>{translations["amp.indicatormanager:disaggregation-values"]}</h6>
+                            <h6>{t("amp.indicatormanager:disaggregation-values")}</h6>
                             <Accordion defaultActiveKey="0">
                               {props.values.disaggregation.map((parentId, parentIdx) => (
                                 <Card key={parentId}>
@@ -861,7 +871,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                     eventKey={String(parentIdx)}
                                     className={styles.accordionHeader}
                                     style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', background: '#f7f7f7', fontWeight: 'bold' }}
-                                    aria-label={translations["amp.indicatormanager:click-to-expand-collapse"]}
+                                    aria-label={t("amp.indicatormanager:click-to-expand-collapse")}
                                   >
                                     <div className={styles.accordionHeaderTitle} style={{ flex: 1 }}>
                                       {disaggregationOptions.find(opt => opt.value === parentId)?.label || `Disaggregation ${parentId}`}
@@ -896,95 +906,95 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                                   <Card.Title className={styles.accordionChildTitle}>{child.value}</Card.Title>
                                                   <div style={{display: 'flex', flexWrap: 'wrap', gap: '32px'}}>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:base-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:base-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx, ['base', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx, ['base', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.base.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx, ['base', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.base.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx, ['base', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-base-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:base-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                     </div>
                                                     <div style={{minWidth: '300px'}}>
-                                                      <h6 color={"red"}>{translations["amp.indicatormanager:target-values"]}</h6>
+                                                      <h6 color={"red"}>{t("amp.indicatormanager:target-values")}</h6>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.originalValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx, ['target', 'originalValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.originalValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx, ['target', 'originalValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-original-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-original-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                         <Form.Control
                                                           type="number"
                                                           value={entry.target.revisedValue || ''}
                                                           onChange={e => updateDisaggregationField(entryIdx, ['target', 'revisedValue'], e.target.value)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
                                                       <Form.Group>
-                                                        <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                        <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                         <DateInput
                                                           translations={translations}
                                                           value={entry.target.revisedValueDate || ''}
                                                           onChange={val => updateDisaggregationField(entryIdx, ['target', 'revisedValueDate'], val)}
                                                           className={styles.input_field}
-                                                          aria-label={translations["amp.indicatormanager:aria-target-revised-value-date"]}
+                                                          aria-label={t("amp.indicatormanager:target-revised-value-date")}
                                                           disabled={false}
                                                         />
                                                       </Form.Group>
@@ -997,7 +1007,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                         </div>
                                       ) : (
                                         <div style={{color: '#888', padding: '1rem', textAlign: 'center', border: '1px solid #eee', borderRadius: '4px'}}>
-                                          {translations["amp.indicatormanager:no-disaggregation-children"]}
+                                          {t("amp.indicatormanager:no-disaggregation-children")}
                                         </div>
                                       )}
                                     </Card.Body>
@@ -1013,7 +1023,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                         <Row className={styles.view_row}>
                           <Col>
                             <div style={{marginTop: '1rem'}}>
-                              <h6>{translations["amp.indicatormanager:disaggregation-values"]}</h6>
+                              <h6>{t("amp.indicatormanager:disaggregation-values")}</h6>
                               <Accordion defaultActiveKey="0">
                                 {disaggregationChildren[props.values.disaggregation[0]]?.map((parentChild: any, parentIdx: number) => (
                                   <Card key={parentChild.id}>
@@ -1022,7 +1032,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                       eventKey={String(parentIdx)}
                                       className={styles.accordionHeader}
                                       style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', background: '#f7f7f7', fontWeight: 'bold' }}
-                                      aria-label={translations["amp.indicatormanager:click-to-expand-collapse"]}
+                                      aria-label={t("amp.indicatormanager:click-to-expand-collapse")}
                                     >
                                       <div className={styles.accordionHeaderTitle} style={{ flex: 1 }}>
                                         {parentChild.value}
@@ -1056,95 +1066,95 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                                     <Card.Title className={styles.accordionChildTitle}>{child.value}</Card.Title>
                                                     <div style={{display: 'flex', flexWrap: 'wrap', gap: '32px'}}>
                                                       <div style={{minWidth: '300px'}}>
-                                                        <h6 color={"red"}>{translations["amp.indicatormanager:base-values"]}</h6>
+                                                        <h6 color={"red"}>{t("amp.indicatormanager:base-values")}</h6>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                           <Form.Control
                                                             type="number"
                                                             value={entry.base.originalValue || ''}
                                                             onChange={e => updateDisaggregationField(entryIdx, ['base', 'originalValue'], e.target.value)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-base-original-value"]}
+                                                            aria-label={t("amp.indicatormanager:base-original-value")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                           <DateInput
                                                             translations={translations}
                                                             value={entry.base.originalValueDate || ''}
                                                             onChange={val => updateDisaggregationField(entryIdx, ['base', 'originalValueDate'], val)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-base-original-value-date"]}
+                                                            aria-label={t("amp.indicatormanager:base-original-value-date")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                           <Form.Control
                                                             type="number"
                                                             value={entry.base.revisedValue || ''}
                                                             onChange={e => updateDisaggregationField(entryIdx, ['base', 'revisedValue'], e.target.value)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-base-revised-value"]}
+                                                            aria-label={t("amp.indicatormanager:base-revised-value")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                           <DateInput
                                                             translations={translations}
                                                             value={entry.base.revisedValueDate || ''}
                                                             onChange={val => updateDisaggregationField(entryIdx, ['base', 'revisedValueDate'], val)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-base-revised-value-date"]}
+                                                            aria-label={t("amp.indicatormanager:base-revised-value-date")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                       </div>
                                                       <div style={{minWidth: '300px'}}>
-                                                        <h6 color={"red"}>{translations["amp.indicatormanager:target-values"]}</h6>
+                                                        <h6 color={"red"}>{t("amp.indicatormanager:target-values")}</h6>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:original-value"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:original-value")}</Form.Label>
                                                           <Form.Control
                                                             type="number"
                                                             value={entry.target.originalValue || ''}
                                                             onChange={e => updateDisaggregationField(entryIdx, ['target', 'originalValue'], e.target.value)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-target-original-value"]}
+                                                            aria-label={t("amp.indicatormanager:target-original-value")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                                                           <DateInput
                                                             translations={translations}
                                                             value={entry.target.originalValueDate || ''}
                                                             onChange={val => updateDisaggregationField(entryIdx, ['target', 'originalValueDate'], val)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-target-original-value-date"]}
+                                                            aria-label={t("amp.indicatormanager:target-original-value-date")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                                                           <Form.Control
                                                             type="number"
                                                             value={entry.target.revisedValue || ''}
                                                             onChange={e => updateDisaggregationField(entryIdx, ['target', 'revisedValue'], e.target.value)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-target-revised-value"]}
+                                                            aria-label={t("amp.indicatormanager:target-revised-value")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
                                                         <Form.Group>
-                                                          <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                                                          <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                                                           <DateInput
                                                             translations={translations}
                                                             value={entry.target.revisedValueDate || ''}
                                                             onChange={val => updateDisaggregationField(entryIdx, ['target', 'revisedValueDate'], val)}
                                                             className={styles.input_field}
-                                                            aria-label={translations["amp.indicatormanager:aria-target-revised-value-date"]}
+                                                            aria-label={t("amp.indicatormanager:target-revised-value-date")}
                                                             disabled={false}
                                                           />
                                                         </Form.Group>
@@ -1157,7 +1167,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                           </div>
                                         ) : (
                                           <div style={{color: '#888', padding: '1rem', textAlign: 'center', border: '1px solid #eee', borderRadius: '4px'}}>
-                                            {translations["amp.indicatormanager:no-disaggregation-children"]}
+                                            {t("amp.indicatormanager:no-disaggregation-children")}
                                           </div>
                                         )}
                                       </Card.Body>
@@ -1171,11 +1181,11 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       )}
                     </div>
                     {/* Responsibility and Frequency */}
-                    <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:responsibility-frequency-info"]}</h5></Col></Row>
+                    <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:responsibility-frequency-info")}</h5></Col></Row>
                     <div className={styles.sectionContainer}>
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item} controlId="formResponsibleOrganizations">
-                          <Form.Label>{translations["amp.indicatormanager:responsible-organizations"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:responsible-organizations")}</Form.Label>
                           <Select
                             isMulti
                             name="responsibleOrganizations"
@@ -1185,12 +1195,13 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                             }}
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.responsibleOrganizations && props.touched.responsibleOrganizations) && styles.text_is_invalid}`}
-                            classNamePrefix="select"
-                            value={responsibleOrgOptions.filter(opt => props.values.responsibleOrganizations?.includes(opt.value))}
+                          classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-responsible-organizations")}
+                          value={responsibleOrgOptions.filter(opt => props.values.responsibleOrganizations?.includes(opt.value))}
                           />
                         </Form.Group>
                         <Form.Group className={styles.view_item} controlId="formFrequency">
-                          <Form.Label>{translations["amp.indicatormanager:frequency"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:frequency")}</Form.Label>
                           <Select
                             name="frequency"
                             options={frequencyOptions}
@@ -1199,23 +1210,24 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                             }}
                             onBlur={props.handleBlur}
                             className={`basic-multi-select ${(props.errors.frequency && props.touched.frequency) && styles.text_is_invalid}`}
-                            classNamePrefix="select"
-                            value={frequencyOptions.find(opt => opt.value === props.values.frequency) || null}
+                          classNamePrefix="select"
+                          placeholder={t("amp.indicatormanager:select-frequency")}
+                          value={frequencyOptions.find(opt => opt.value === props.values.frequency) || null}
                           />
                         </Form.Group>
                       </Row>
                     </div>
                     {/* Value Tracking */}
-                    <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{translations["amp.indicatormanager:value-tracking"]}</h5></Col></Row>
+                    <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:value-tracking")}</h5></Col></Row>
                     <div className={styles.sectionContainer}>
                       <Form.Group as={Col}>
                         <Form.Label className={styles.view_one_item}>
-                          <h4>{translations["amp.indicatormanager:base-values"]}</h4>
+                          <h4>{t("amp.indicatormanager:base-values")}</h4>
                         </Form.Label>
                         {/* Original Value and Date in one row */}
                         <Row className={styles.view_row}>
                           <Form.Group className={styles.view_item}>
-                            <Form.Label>{translations['amp.indicatormanager:original-value']}</Form.Label>
+                            <Form.Label>{t('amp.indicatormanager:original-value')}</Form.Label>
                             <Form.Control
                                 defaultValue={props.values.base?.originalValue}
                                 onChange={props.handleChange}
@@ -1223,7 +1235,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                                 name="base.originalValue"
                                 type="number"
                                 className={`${styles.input_field} ${(props.errors.base?.originalValue && props.touched.base?.originalValue) && styles.text_is_invalid}`}
-                                placeholder={translations["amp.indicatormanager:enter-original-value"]} />
+                                placeholder={t("amp.indicatormanager:enter-original-value")} />
 
                             <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                               {props.errors.base?.originalValue}
@@ -1231,7 +1243,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                           </Form.Group>
 
                           <Form.Group className={styles.view_item}>
-                            <Form.Label>{translations["amp.indicatormanager:original-value-date"]}</Form.Label>
+                            <Form.Label>{t("amp.indicatormanager:original-value-date")}</Form.Label>
                             <DateInput
                                 translations={translations}
                                 value={props.values.base?.originalValueDate}
@@ -1259,7 +1271,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       {/* Revised Value and Date in one row */}
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                           <Form.Control
                               defaultValue={props.values.base.revisedValue}
                               onChange={props.handleChange}
@@ -1267,7 +1279,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                               name="base.revisedValue"
                               type="number"
                               className={`${styles.input_field} ${(props.errors.base?.revisedValue && props.touched.base?.revisedValue) && styles.text_is_invalid}`}
-                              placeholder={translations["amp.indicatormanager:enter-revised-value"]} />
+                              placeholder={t("amp.indicatormanager:enter-revised-value")} />
 
                           <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                             {props.errors.base?.revisedValue}
@@ -1275,7 +1287,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                         </Form.Group>
 
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations['amp.indicatormanager:revised-value-date']}</Form.Label>
+                          <Form.Label>{t('amp.indicatormanager:revised-value-date')}</Form.Label>
                           <DateInput
                               translations={translations}
                               value={props.values.base.revisedValueDate}
@@ -1301,11 +1313,11 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       </Row>
                     </Form.Group>
                     <Form.Group as={Col}>
-                      <Form.Label><h4>{translations["amp.indicatormanager:target-values"]}</h4></Form.Label>
+                      <Form.Label><h4>{t("amp.indicatormanager:target-values")}</h4></Form.Label>
                       {/* Original Value and Date in one row */}
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:target-value"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:target-value")}</Form.Label>
                           <Form.Control
                               defaultValue={props.values.target.originalValue}
                               onChange={props.handleChange}
@@ -1313,14 +1325,14 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                               name="target.originalValue"
                               type="number"
                               className={`${styles.input_field} ${(props.errors.target?.originalValue && props.touched.target?.originalValue) && styles.text_is_invalid}`}
-                              placeholder={translations["amp.indicatormanager:enter-target-value"]} />
+                              placeholder={t("amp.indicatormanager:enter-target-value")} />
 
                           <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                             {props.errors.target?.originalValue}
                           </Form.Control.Feedback>
                         </Form.Group>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:target-value-date"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:target-value-date")}</Form.Label>
                           <DateInput
                               translations={translations}
                               value={props.values.target.originalValueDate}
@@ -1344,7 +1356,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       {/* Revised Value and Date in one row */}
                       <Row className={styles.view_row}>
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:revised-value"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:revised-value")}</Form.Label>
                           <Form.Control
                               defaultValue={props.values.target.revisedValue}
                               onChange={props.handleChange}
@@ -1352,7 +1364,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                               name="target.revisedValue"
                               type="number"
                               className={`${styles.input_field} ${(props.errors.target?.revisedValue && props.touched.target?.revisedValue) && styles.text_is_invalid}`}
-                              placeholder={translations["amp.indicatormanager:enter-revised-value"]} />
+                              placeholder={t("amp.indicatormanager:enter-revised-value")} />
 
                           <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                             {props.errors.target?.revisedValue}
@@ -1360,7 +1372,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                         </Form.Group>
 
                         <Form.Group className={styles.view_item}>
-                          <Form.Label>{translations["amp.indicatormanager:revised-value-date"]}</Form.Label>
+                          <Form.Label>{t("amp.indicatormanager:revised-value-date")}</Form.Label>
                           <DateInput
                               translations={translations}
                               value={props.values.target.revisedValueDate}
@@ -1387,11 +1399,11 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                     </Form.Group>
                   </div>
                   {/* Other Considerations */}
-                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>Other Considerations</h5></Col></Row>
+                  <Row className={styles.view_row}><Col><h5 className={styles.sectionTitle}>{t("amp.indicatormanager:other-considerations")}</h5></Col></Row>
                   <div className={styles.sectionContainer}>
                     <Row className={styles.view_row}>
                       <Form.Group className={styles.view_item} controlId="Ascending">
-                        <Form.Label>{translations["amp.indicatormanager:ascending"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:ascending")}</Form.Label>
                         <Select
                             name="ascending"
                             options={ascendingOptions}
@@ -1403,7 +1415,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                             }}
                             defaultValue={{
                               value: false,
-                              label: translations["amp.indicatormanager:true"]
+                              label: t("amp.indicatormanager:true")
                             }}
                         />
                         <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
@@ -1412,7 +1424,7 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
                       </Form.Group>
 
                       <Form.Group className={styles.view_item} controlId="formCreationDate">
-                        <Form.Label>{translations["amp.indicatormanager:table-header-creation-date"]}</Form.Label>
+                        <Form.Label>{t("amp.indicatormanager:table-header-creation-date")}</Form.Label>
                         <DateInput
                             translations={translations}
                             name="creationDate"
@@ -1430,10 +1442,10 @@ const EditIndicatorModal: React.FC<EditIndicatorModalProps> = (props) => {
               </Modal.Body>
               <Modal.Footer>
                 <Button variant="secondary" onClick={handleClose}>
-                  {translations["amp.indicatormanager:close"]}
+                  {t("amp.indicatormanager:close")}
                 </Button>
                 <Button type="submit" variant="success" >
-                  {translations["amp.indicatormanager:save"]}
+                  {t("amp.indicatormanager:save")}
                 </Button>
               </Modal.Footer>
             </Form>
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutcomeModal.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutcomeModal.tsx
index 81eeefb3068..05d09490b42 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutcomeModal.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutcomeModal.tsx
@@ -3,6 +3,7 @@ import { Modal, Button, Form, Row, Col } from 'react-bootstrap';
 import { Formik, FormikProps, Form as FormikForm, Field } from 'formik';
 import * as Yup from 'yup';
 import styles from './css/IndicatorModal.module.css';
+import initialTranslations from '../../config/initialTranslations.json';
 
 interface AddNewOutcomeModalProps {
   show: boolean;
@@ -15,8 +16,9 @@ interface AddNewOutcomeModalProps {
 
 const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubmit, initialName = '', initialDescription = '', translations = {} }) => {
   const nodeRef = useRef(null);
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
   const validationSchema = Yup.object().shape({
-    name: Yup.string().required(translations['amp.outcomeoutput:errors-name-required'] || 'Name is required'),
+    name: Yup.string().required(t('amp.outcomeoutput:errors-name-required')),
     description: Yup.string()
   });
 
@@ -40,7 +42,7 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
       size='lg'
     >
       <Modal.Header closeButton>
-        <Modal.Title>{translations['amp.outcomeoutput:modal-title-outcome'] || 'Add New Outcome'}</Modal.Title>
+        <Modal.Title>{t('amp.outcomeoutput:add-new-outcome')}</Modal.Title>
       </Modal.Header>
       <Formik
         initialValues={initialValues}
@@ -58,7 +60,7 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
               <div className={styles.viewmodal_wrapper}>
                 <Row className={styles.view_row}>
                   <Form.Group as={Col} className={styles.view_item} controlId="formOutcomeName">
-                    <Form.Label>{translations['amp.outcomeoutput:outcome-name'] || 'Outcome Name'}</Form.Label>
+                    <Form.Label>{t('amp.outcomeoutput:outcome-name')}</Form.Label>
                     <Form.Control
                       defaultValue={props.values.name}
                       onChange={props.handleChange}
@@ -68,7 +70,7 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
                       isInvalid={!!props.errors.name}
                       required
                       aria-required type="text"
-                      placeholder={translations['amp.outcomeoutput:outcome-name'] || 'Outcome Name'}
+                      placeholder={t('amp.outcomeoutput:outcome-name')}
                     />
                     <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                       {props.errors.name}
@@ -77,7 +79,7 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
                 </Row>
                 <Row className={styles.view_row}>
                   <Form.Group as={Col} className={styles.view_item} controlId="formOutcomeDescription">
-                    <Form.Label>{translations['amp.outcomeoutput:outcome-description'] || 'Outcome Description'}</Form.Label>
+                    <Form.Label>{t('amp.outcomeoutput:outcome-description')}</Form.Label>
                     <Form.Control
                       defaultValue={props.values.description}
                       onChange={props.handleChange}
@@ -85,7 +87,7 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
                       name="description"
                       type="text"
                       className={`${styles.input_field} ${(props.errors.description && props.touched.description) && styles.text_is_invalid}`}
-                      placeholder={translations['amp.outcomeoutput:outcome-description'] || 'Outcome Description'}
+                      placeholder={t('amp.outcomeoutput:outcome-description')}
                     />
                     <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                       {props.errors.description}
@@ -96,10 +98,10 @@ const OutcomeModal: React.FC<AddNewOutcomeModalProps> = ({ show, setShow, onSubm
             </Modal.Body>
             <Modal.Footer>
               <Button variant="secondary" onClick={handleClose}>
-                {translations['amp.outcomeoutput:cancel'] || 'Cancel'}
+                {t('amp.outcomeoutput:cancel')}
               </Button>
               <Button type="submit" variant="success">
-                {translations['amp.outcomeoutput:save-outcome'] || 'Save Outcome'}
+                {t('amp.outcomeoutput:save-outcome')}
               </Button>
             </Modal.Footer>
           </Form>
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutputModal.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutputModal.tsx
index 187b249ca74..488eeecf847 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutputModal.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/OutputModal.tsx
@@ -3,6 +3,7 @@ import { Modal, Button, Form, Row, Col } from 'react-bootstrap';
 import { Formik, FormikProps } from 'formik';
 import * as Yup from 'yup';
 import styles from './css/IndicatorModal.module.css';
+import initialTranslations from '../../config/initialTranslations.json';
 
 interface Outcome {
   id: number;
@@ -31,12 +32,13 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
   loading = false
 }) => {
   const nodeRef = useRef(null);
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
 
   // Only render if selectedOutcome is provided
   if (!selectedOutcome) return null;
 
   const validationSchema = Yup.object().shape({
-    name: Yup.string().required(translations['amp.outcomeoutput:errors-name-required'] || 'Name is required'),
+    name: Yup.string().required(t('amp.outcomeoutput:errors-name-required')),
     description: Yup.string(),
     outcomeId: Yup.number().required('Outcome is required')
   });
@@ -62,7 +64,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
       size='lg'
     >
       <Modal.Header closeButton>
-        <Modal.Title>{translations['amp.outcomeoutput:modal-title-output'] || 'Add New Output'}</Modal.Title>
+        <Modal.Title>{t('amp.outcomeoutput:add-new-output')}</Modal.Title>
       </Modal.Header>
       <Formik
         initialValues={initialValues}
@@ -80,7 +82,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
               <div className={styles.viewmodal_wrapper}>
                 <Row className={styles.view_row}>
                   <Form.Group as={Col} className={styles.view_item} controlId="formOutputName">
-                    <Form.Label>{translations['amp.outcomeoutput:output-name'] || 'Output Name'}</Form.Label>
+                    <Form.Label>{t('amp.outcomeoutput:output-name')}</Form.Label>
                     <Form.Control
                       defaultValue={props.values.name}
                       onChange={props.handleChange}
@@ -90,7 +92,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
                       isInvalid={!!props.errors.name}
                       required
                       aria-required type="text"
-                      placeholder={translations['amp.outcomeoutput:output-name'] || 'Output Name'}
+                      placeholder={t('amp.outcomeoutput:output-name')}
                     />
                     <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                       {props.errors.name}
@@ -99,7 +101,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
                 </Row>
                 <Row className={styles.view_row}>
                   <Form.Group as={Col} className={styles.view_item} controlId="formOutputDescription">
-                    <Form.Label>{translations['amp.outcomeoutput:output-description'] || 'Output Description'}</Form.Label>
+                    <Form.Label>{t('amp.outcomeoutput:output-description')}</Form.Label>
                     <Form.Control
                       defaultValue={props.values.description}
                       onChange={props.handleChange}
@@ -107,7 +109,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
                       name="description"
                       type="text"
                       className={`${styles.input_field} ${(props.errors.description && props.touched.description) && styles.text_is_invalid}`}
-                      placeholder={translations['amp.outcomeoutput:output-description'] || 'Output Description'}
+                      placeholder={t('amp.outcomeoutput:output-description')}
                     />
                     <Form.Control.Feedback type="invalid" className={styles.text_is_invalid}>
                       {props.errors.description}
@@ -116,7 +118,7 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
                 </Row>
                 <Row className={styles.view_row}>
                   <Form.Group as={Col} className={styles.view_item} controlId="formOutputOutcome">
-                    <Form.Label>{translations['amp.outcomeoutput:linked-outcome'] || 'Linked Outcome'}</Form.Label>
+                    <Form.Label>{t('amp.outcomeoutput:linked-outcome')}</Form.Label>
                     <Form.Control
                       type="text"
                       value={`${selectedOutcome.id}: ${selectedOutcome.name}`}
@@ -130,10 +132,10 @@ const OutputModal: React.FC<AddNewOutputModalProps> = ({
             </Modal.Body>
             <Modal.Footer>
               <Button variant="secondary" onClick={handleClose} disabled={loading}>
-                {translations['amp.outcomeoutput:cancel'] || 'Cancel'}
+                {t('amp.outcomeoutput:cancel')}
               </Button>
               <Button type="submit" variant="success" disabled={loading}>
-                {translations['amp.outcomeoutput:save-output'] || 'Save Output'}
+                {t('amp.outcomeoutput:save-output')}
               </Button>
             </Modal.Footer>
           </Form>
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/ViewIndicatorModal.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/ViewIndicatorModal.tsx
index e732221555a..71aea2c1eb8 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/ViewIndicatorModal.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/modals/ViewIndicatorModal.tsx
@@ -5,6 +5,7 @@ import backdropStyles from './css/IndicatorModal.module.css';
 import styles from './css/ViewIndicatorModal.module.css';
 import { DefaultComponentProps, IndicatorObjectType, ProgramObjectType, SectorObjectType } from '../../types';
 import { useSelector } from 'react-redux';
+import initialTranslations from '../../config/initialTranslations.json';
 
 interface ViewIndicatorModalProps extends DefaultComponentProps {
     show: boolean;
@@ -14,6 +15,7 @@ interface ViewIndicatorModalProps extends DefaultComponentProps {
 
 const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
     const { show, setShow, indicator, translations } = props;
+    const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
     const sectorsReducer = useSelector((state: any) => state.fetchSectorsReducer);
     const programsReducer = useSelector((state: any) => state.fetchProgramsReducer);
     const categoriesReducer = useSelector((state: any) => state.fetchAmpCategoryReducer);
@@ -39,29 +41,29 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
 
     // Helper functions for lookups
     const getCategoryLabel = (id: number | undefined) => {
-        if (!id) return translations["amp.indicatormanager:no-data"];
+        if (!id) return t("amp.indicatormanager:no-data");
         const found = categoriesReducer.categories.find((cat: any) => cat.id === id);
         return found ? found.value : id;
     };
     const getOutcomeLabel = (id: number | undefined) => {
-        if (!id) return translations["amp.indicatormanager:no-data"];
+        if (!id) return t("amp.indicatormanager:no-data");
         const found = outcomesReducer.outcomes.find((o: any) => o.id === id);
         return found ? found.name : id;
     };
     const getOutputLabel = (id: number | undefined) => {
-        if (!id) return translations["amp.indicatormanager:no-data"];
+        if (!id) return t("amp.indicatormanager:no-data");
         const found = outputsReducer.outputs.find((o: any) => o.id === id);
         return found ? found.name : id;
     };
     const getResponsibleOrgLabels = (ids: number[] = []) => {
-        if (!ids.length) return [translations["amp.indicatormanager:no-data"]];
+        if (!ids.length) return [t("amp.indicatormanager:no-data")];
         return ids.map(id => {
             const found = responsibleOrgsReducer.options.find((org: any) => org.value === id);
             return found ? found.label : id;
         });
     };
     const getProgramLabel = (id: number | null) => {
-        if (!id) return translations["amp.indicatormanager:no-data"];
+        if (!id) return t("amp.indicatormanager:no-data");
         const found = programsReducer.programs.find((p: any) => p.id === id);
         return found ? found.name : id;
     };
@@ -80,7 +82,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
             <Modal.Header closeButton className={styles.modal_header}>
                 <Modal.Title className={styles.modal_title}>
                     <i className="fas fa-info-circle me-2"></i>
-                    {translations["amp.indicatormanager:view-indicator"]}
+                    {t("amp.indicatormanager:view-indicator")}
                 </Modal.Title>
             </Modal.Header>
             {indicator ?
@@ -90,24 +92,24 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#0052CC', fontWeight: 'bold'}}>
                                 <i className="fas fa-info-circle me-2"></i>
-                                {translations["amp.indicatormanager:core-info"] || "Core Indicator Information"}
+                                {t("amp.indicatormanager:core-info")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:indicator-name"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:indicator-name")}</b></div>
                                     <div className={`${styles.value} ${styles.important}`}>{indicator.name}</div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:indicator-code"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:indicator-code")}</b></div>
                                     <div className={styles.value}>{indicator.code}</div>
                                 </Col>
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={12} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:indicator-description"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:indicator-description")}</b></div>
                                     <div className={styles.value} style={{fontStyle: 'italic'}}>
                                         {indicator.description === "" || !indicator.description ?
-                                            <span className={styles.no_data}>{translations["amp.indicatormanager:no-description-available"]}</span> :
+                                            <span className={styles.no_data}>{t("amp.indicatormanager:no-description-available")}</span> :
                                             indicator.description
                                         }
                                     </div>
@@ -115,11 +117,11 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:relevance-for-climate-change"]}</b></div>
-                                    <div className={styles.value}>{indicator.relevanceForClimateChange || <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:relevance-for-climate-change")}</b></div>
+                                    <div className={styles.value}>{indicator.relevanceForClimateChange || <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:type"] || "Type"}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:type")}</b></div>
                                     <div className={styles.value}>{getCategoryLabel(indicator.indicatorType)}</div>
                                 </Col>
                             </Row>
@@ -129,27 +131,27 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#FF5630', fontWeight: 'bold'}}>
                                 <i className="fas fa-link me-2"></i>
-                                {translations["amp.indicatormanager:categorization-linkage-info"] || "Categorization and Linkage"}
+                                {t("amp.indicatormanager:categorization-linkage-info")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:outcome"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:outcome")}</b></div>
                                     <div className={styles.value}>{getOutcomeLabel(indicator.outcomeId)}</div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:output"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:output")}</b></div>
                                     <div className={styles.value}>{getOutputLabel(indicator.outputId)}</div>
                                 </Col>
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={12} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:logframe-links"] || "Link to Logframe (Program)"}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:logframe-links")}</b></div>
                                     <div className={styles.value}>{getProgramLabel(indicator.programId)}</div>
                                 </Col>
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={12} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:sectors"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:sectors")}</b></div>
                                     <div className={styles.value}>
                                         {sectorData.length > 0 ? (
                                             <ul style={{ paddingLeft: '1.2em', marginBottom: 0 }}>
@@ -158,7 +160,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                 ))}
                                             </ul>
                                         ) : (
-                                            <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>
+                                            <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>
                                         )}
                                     </div>
                                 </Col>
@@ -169,21 +171,21 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#36B37E', fontWeight: 'bold'}}>
                                 <i className="fas fa-database me-2"></i>
-                                {translations["amp.indicatormanager:data"] || "Data Definition and Sourcing"}
+                                {t("amp.indicatormanager:data")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:data"]}</b></div>
-                                    <div className={styles.value}>{indicator.data || <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:data")}</b></div>
+                                    <div className={styles.value}>{indicator.data || <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:data-source"]}</b></div>
-                                    <div className={styles.value}>{indicator.dataSource || <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:data-source")}</b></div>
+                                    <div className={styles.value}>{indicator.dataSource || <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                 </Col>
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:disaggregation"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:disaggregation")}</b></div>
                                     <div className={styles.value}>
                                         {indicator.disaggregation && indicator.disaggregation.length > 0 ? (
                                             <ul style={{ paddingLeft: '1.2em', marginBottom: 0 }}>
@@ -192,19 +194,19 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                 ))}
                                             </ul>
                                         ) : (
-                                            <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>
+                                            <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>
                                         )}
                                     </div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:unit-of-measure"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:unit-of-measure")}</b></div>
                                     <div className={styles.value}>{getCategoryLabel(indicator.unitOfMeasure)}</div>
                                 </Col>
                             </Row>
                             <Row className={styles.view_row}>
                                 <Col md={12} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:calculation-method"]}</b></div>
-                                    <div className={styles.value}>{indicator.calculationMethod || <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:calculation-method")}</b></div>
+                                    <div className={styles.value}>{indicator.calculationMethod || <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                 </Col>
                             </Row>
                         </div>
@@ -213,11 +215,11 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#FF8B00', fontWeight: 'bold'}}>
                                 <i className="fas fa-table me-2"></i>
-                                {translations["amp.indicatormanager:disaggregation-values"] || "Disaggregation Values"}
+                                {t("amp.indicatormanager:disaggregation-values")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={12} style={{ width: '100%' }}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:disaggregation-values"] || "Disaggregation Values"}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:disaggregation-values")}</b></div>
                                     <div className={styles.value} style={{ width: '100%' }}>
                                         {indicator.disaggregationValues && indicator.disaggregationValues.length > 0 ? (
                                             <div style={{ maxHeight: '40vh', overflow: 'auto', width: '100%' }}>
@@ -243,21 +245,21 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                         <tr>
                                                           <th style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>
                                                             {/* Parent disaggregation label for first column */}
-                                                            {parentIds.length > 0 ? getCategoryLabel(parentGroups[parentIds[0]][0].parentDisaggregationId) : translations["amp.indicatormanager:no-parent-category"] || "No Parent"}
+                                                            {parentIds.length > 0 ? getCategoryLabel(parentGroups[parentIds[0]][0].parentDisaggregationId) : t("amp.indicatormanager:no-parent-category")}
                                                           </th>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
                                                             if (children.length > 0) {
                                                               return (
                                                                 <th key={parentId} colSpan={children.length * 2} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>
-                                                                  {getCategoryLabel(parentId) || translations["amp.indicatormanager:no-parent-category"] || "No Parent"}
+                                                                  {getCategoryLabel(parentId) || t("amp.indicatormanager:no-parent-category")}
                                                                 </th>
                                                               );
                                                             } else {
                                                               // No children, colSpan=2
                                                               return (
                                                                 <th key={parentId} colSpan={2} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>
-                                                                  {getCategoryLabel(parentId) || translations["amp.indicatormanager:no-parent-category"] || "No Parent"}
+                                                                  {getCategoryLabel(parentId) || t("amp.indicatormanager:no-parent-category")}
                                                                 </th>
                                                               );
                                                             }
@@ -270,7 +272,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                             {/* Child category label for first column */}
                                                             {parentIds.length > 0 && getChildren(parentIds[0]).length > 0
                                                               ? getCategoryLabel(parentGroups[parentIds[0]][0].childDisaggregationId)
-                                                              : translations["amp.indicatormanager:no-child-category"] || "No Child"}
+                                                              : t("amp.indicatormanager:no-child-category")}
                                                           </th>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
@@ -299,17 +301,17 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                             if (children.length > 0) {
                                                               return children.map(child => [
                                                                 <th key={`child-value-${parentId}-${child.childCategoryId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>
-                                                                  <div style={{ fontSize: '0.9em', color: '#888' }}>{translations["amp.indicatormanager:value"] || "Value"}</div>
+                                                                  <div style={{ fontSize: '0.9em', color: '#888' }}>{t("amp.indicatormanager:value")}</div>
                                                                 </th>,
                                                                 <th key={`child-date-${parentId}-${child.childCategoryId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>
-                                                                  <div style={{ fontSize: '0.9em', color: '#888' }}>{translations["amp.indicatormanager:date"] || "Date"}</div>
+                                                                  <div style={{ fontSize: '0.9em', color: '#888' }}>{t("amp.indicatormanager:date")}</div>
                                                                 </th>
                                                               ]);
                                                             } else {
                                                               // No children, just Value/Date
                                                               return [
-                                                                <th key={`parent-value-${parentId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>{translations["amp.indicatormanager:value"] || "Value"}</th>,
-                                                                <th key={`parent-date-${parentId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>{translations["amp.indicatormanager:date"] || "Date"}</th>
+                                                                <th key={`parent-value-${parentId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>{t("amp.indicatormanager:value")}</th>,
+                                                                <th key={`parent-date-${parentId}`} style={{ border: '1px solid #ddd', padding: '8px', textAlign: 'center' }}>{t("amp.indicatormanager:date")}</th>
                                                               ];
                                                             }
                                                           })}
@@ -318,7 +320,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                       <tbody>
                                                         {/* Original Base Value */}
                                                         <tr>
-                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{translations["amp.indicatormanager:original-base-value"] || "Original Base Value"}</td>
+                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{t("amp.indicatormanager:original-base-value")}</td>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
                                                             if (children.length > 0) {
@@ -338,7 +340,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                         </tr>
                                                         {/* Revised Base Value */}
                                                         <tr>
-                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{translations["amp.indicatormanager:revised-base-value"] || "Revised Base Value"}</td>
+                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{t("amp.indicatormanager:revised-base-value")}</td>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
                                                             if (children.length > 0) {
@@ -357,7 +359,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                         </tr>
                                                         {/* Original Target Value */}
                                                         <tr>
-                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{translations["amp.indicatormanager:original-target-value"] || "Original Target Value"}</td>
+                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{t("amp.indicatormanager:original-target-value")}</td>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
                                                             if (children.length > 0) {
@@ -376,7 +378,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                         </tr>
                                                         {/* Revised Target Value */}
                                                         <tr>
-                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{translations["amp.indicatormanager:revised-target-value"] || "Revised Target Value"}</td>
+                                                          <td style={{ border: '1px solid #ddd', padding: '8px', fontWeight: 'bold' }}>{t("amp.indicatormanager:revised-target-value")}</td>
                                                           {parentIds.map(parentId => {
                                                             const children = getChildren(parentId);
                                                             if (children.length > 0) {
@@ -399,7 +401,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                 })()}
                                             </div>
                                         ) : (
-                                            <div className={styles.no_data}>{translations["amp.indicatormanager:no-disaggregation-values"] || "No Disaggregation Values"}</div>
+                                            <div className={styles.no_data}>{t("amp.indicatormanager:no-disaggregation-values")}</div>
                                         )}
                                     </div>
                                 </Col>
@@ -410,11 +412,11 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#5243AA', fontWeight: 'bold'}}>
                                 <i className="fas fa-users me-2"></i>
-                                {translations["amp.indicatormanager:responsibility-frequency-info"] || "Responsibility and Frequency"}
+                                {t("amp.indicatormanager:responsibility-frequency-info")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:responsible-organizations"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:responsible-organizations")}</b></div>
                                     <div className={styles.value}>
                                         {indicator.responsibleOrganizations && indicator.responsibleOrganizations.length > 0 ? (
                                             <ul style={{ paddingLeft: '1.2em', marginBottom: 0 }}>
@@ -423,12 +425,12 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                                                 ))}
                                             </ul>
                                         ) : (
-                                            <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>
+                                            <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>
                                         )}
                                     </div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:frequency"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:frequency")}</b></div>
                                     <div className={styles.value}>{getCategoryLabel(indicator.frequency)}</div>
                                 </Col>
                             </Row>
@@ -438,51 +440,51 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{borderBottom: '2px solid #e0e0e0', marginBottom: 24, paddingBottom: 16}}>
                             <h4 className={styles.section_title} style={{color: '#36B37E', fontWeight: 'bold'}}>
                                 <i className="fas fa-chart-line me-2"></i>
-                                {translations["amp.indicatormanager:value-tracking"] || "Value Tracking"}
+                                {t("amp.indicatormanager:value-tracking")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.section} style={{borderRight: '1px solid #e0e0e0', paddingRight: 16}}>
                                     <h5 className={styles.section_title} style={{color: '#36B37E', fontWeight: 'bold'}}>
                                         <i className="fas fa-chart-line me-2"></i>
-                                        {translations["amp.indicatormanager:base-values"]}
+                                        {t("amp.indicatormanager:base-values")}
                                     </h5>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:original-base-value"]}</div>
-                                        <div className={styles.value}>{indicator.base?.originalValue ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:original-base-value")}</div>
+                                        <div className={styles.value}>{indicator.base?.originalValue ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:original-value-date"]}</div>
-                                        <div className={styles.value}>{indicator.base?.originalValueDate ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:original-value-date")}</div>
+                                        <div className={styles.value}>{indicator.base?.originalValueDate ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:revised-value"]}</div>
-                                        <div className={styles.value}>{indicator.base?.revisedValue ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:revised-value")}</div>
+                                        <div className={styles.value}>{indicator.base?.revisedValue ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:revised-value-date"]}</div>
-                                        <div className={styles.value}>{indicator.base?.revisedValueDate ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:revised-value-date")}</div>
+                                        <div className={styles.value}>{indicator.base?.revisedValueDate ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                 </Col>
                                 <Col md={6} className={styles.section} style={{paddingLeft: 16}}>
                                     <h5 className={styles.section_title} style={{color: '#FF8B00', fontWeight: 'bold'}}>
                                         <i className="fas fa-bullseye me-2"></i>
-                                        {translations["amp.indicatormanager:target-values"]}
+                                        {t("amp.indicatormanager:target-values")}
                                     </h5>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:target-value"]}</div>
-                                        <div className={styles.value}>{indicator.target?.originalValue ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:target-value")}</div>
+                                        <div className={styles.value}>{indicator.target?.originalValue ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:target-value-date"]}</div>
-                                        <div className={styles.value}>{indicator.target?.originalValueDate ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:target-value-date")}</div>
+                                        <div className={styles.value}>{indicator.target?.originalValueDate ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:revised-value"]}</div>
-                                        <div className={styles.value}>{indicator.target?.revisedValue ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:revised-value")}</div>
+                                        <div className={styles.value}>{indicator.target?.revisedValue ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                     <div className={styles.view_item}>
-                                        <div className={styles.label}>{translations["amp.indicatormanager:revised-value-date"]}</div>
-                                        <div className={styles.value}>{indicator.target?.revisedValueDate ?? <span className={styles.no_data}>{translations["amp.indicatormanager:no-data"]}</span>}</div>
+                                        <div className={styles.label}>{t("amp.indicatormanager:revised-value-date")}</div>
+                                        <div className={styles.value}>{indicator.target?.revisedValueDate ?? <span className={styles.no_data}>{t("amp.indicatormanager:no-data")}</span>}</div>
                                     </div>
                                 </Col>
                             </Row>
@@ -492,18 +494,18 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                         <div className={styles.section} style={{marginTop: 24}}>
                             <h4 className={styles.section_title} style={{color: '#FF5630', fontWeight: 'bold'}}>
                                 <i className="fas fa-ellipsis-h me-2"></i>
-                                {translations["amp.indicatormanager:other-considerations"] || "Other Considerations"}
+                                {t("amp.indicatormanager:other-considerations")}
                             </h4>
                             <Row className={styles.view_row}>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:table-header-creation-date"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:table-header-creation-date")}</b></div>
                                     <div className={styles.value}>{indicator.creationDate}</div>
                                 </Col>
                                 <Col md={6} className={styles.view_item}>
-                                    <div className={styles.label}><b>{translations["amp.indicatormanager:ascending"]}</b></div>
+                                    <div className={styles.label}><b>{t("amp.indicatormanager:ascending")}</b></div>
                                     <div className={styles.value}>
                                         <Badge content={indicator.ascending ? "success" : "secondary"} style={{fontWeight: 'bold'}}>
-                                            {indicator.ascending ? translations["amp.indicatormanager:yes"] : translations["amp.indicatormanager:no"]}
+                                            {indicator.ascending ? t("amp.indicatormanager:yes") : t("amp.indicatormanager:no")}
                                         </Badge>
                                     </div>
                                 </Col>
@@ -514,7 +516,7 @@ const ViewIndicatorModal: React.FC<ViewIndicatorModalProps> = (props) => {
                 <Modal.Body>
                     <div className={styles.error_state}>
                         <i className="fas fa-exclamation-triangle"></i>
-                        <h3>{translations["amp.indicatormanager:view-error"]}</h3>
+                        <h3>{t("amp.indicatormanager:view-error")}</h3>
                     </div>
                 </Modal.Body>
             }
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/table/Table.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/table/Table.tsx
index e8ca2846223..46ef98ebe87 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/table/Table.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/components/table/Table.tsx
@@ -26,6 +26,7 @@ import { setSizePerPage} from '../../reducers/fetchIndicatorsReducer';
 import Select from "react-select";
 import {formatProgramSchemeToSelect} from "../../utils/helpers";
 import { useNavigate } from 'react-router-dom';
+import initialTranslations from '../../config/initialTranslations.json';
 
 interface SkeletonTableProps extends DefaultComponentProps {
   columns: any;
@@ -84,6 +85,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
     filterByProgram,
     programs
   } = props;
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
   const dispatch = useDispatch();
   const programSchemeReducer = useSelector((state: any) => state.fetchProgramsReducer);
   const sectorsReducer = useSelector((state: any) => state.fetchSectorsReducer);
@@ -105,29 +107,29 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
   const [showAddNewIndicatorModal, setShowAddNewIndicatorModal] = useState(false);
   const [programOptions, setProgramOptions] = useState<GroupSelectValue[]>([
     {
-      label: translations['amp.indicatormanager:all-programs'],
+      label: t('amp.indicatormanager:all-programs'),
       options: [{
         value: 0,
-        label: translations['amp.indicatormanager:all-programs']
+        label: t('amp.indicatormanager:all-programs')
       }]
     }
   ]);
   const [sectorOptions, setSectorOptions] = useState<SelectValue[]>([{
     value: 0,
-    label: translations['amp.indicatormanager:all-sectors']
+    label: t('amp.indicatormanager:all-sectors')
   }]);
 
   const [outcomeOptions, setOutcomeOptions] = useState<SelectValue[]>([{
     value: 0,
-    label: translations['amp.indicatormanager:all-outcomes']
+    label: t('amp.indicatormanager:all-outcomes')
   }]);
   const [outputOptions, setOutputOptions] = useState<SelectValue[]>([{
     value: 0,
-    label: translations['amp.indicatormanager:all-outputs']
+    label: t('amp.indicatormanager:all-outputs')
   }]);
   const [indicatorTypeOptions, setIndicatorTypeOptions] = useState<SelectValue[]>([{
     value: 0,
-    label: translations['amp.indicatormanager:all-indicator-types']
+    label: t('amp.indicatormanager:all-indicator-types')
   }]);
 
   const showAddNewIndicatorModalHandler = () => {
@@ -152,7 +154,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
         value: outcome.id,
         label: outcome.name,
       }));
-      setOutcomeOptions([{ value: 0, label: translations['amp.indicatormanager:all-outcomes'] }, ...formattedOutcomes]);
+      setOutcomeOptions([{ value: 0, label: t('amp.indicatormanager:all-outcomes') }, ...formattedOutcomes]);
     }
 
     if (outputsReducer && outputsReducer.outputs) {
@@ -160,7 +162,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
         value: output.id,
         label: output.name,
       }));
-      setOutputOptions([{ value: 0, label: translations['amp.indicatormanager:all-outputs'] }, ...formattedOutputs]);
+      setOutputOptions([{ value: 0, label: t('amp.indicatormanager:all-outputs') }, ...formattedOutputs]);
     }
 
     // Set indicator type options from Redux
@@ -169,7 +171,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
         value: indicatorType.id,
         label: indicatorType.value,
       }));
-      setIndicatorTypeOptions([{ value: 0, label: translations['amp.indicatormanager:all-indicator-types'] }, ...formattedIndicatorTypes]);
+      setIndicatorTypeOptions([{ value: 0, label: t('amp.indicatormanager:all-indicator-types') }, ...formattedIndicatorTypes]);
     }
   }, [sectors, programConfiguration, translations]);
 
@@ -200,18 +202,18 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
         value: 100,
       },
       {
-        text: translations['amp.indicatormanager:all'],
+        text: t('amp.indicatormanager:all'),
         value: data.length,
       }
     ],
-    firstPageText: translations['amp.indicatormanager:first'],
-    prePageText: translations['amp.indicatormanager:previous'],
-    nextPageText: translations['amp.indicatormanager:next'],
-    lastPageText: translations['amp.indicatormanager:last'],
-    nextPageTitle: translations['amp.indicatormanager:next-page'],
-    prePageTitle: translations['amp.indicatormanager:pre-page'],
-    firstPageTitle: translations['amp.indicatormanager:first-page'],
-    lastPageTitle: translations['amp.indicatormanager:last-page'],
+    firstPageText: t('amp.indicatormanager:first'),
+    prePageText: t('amp.indicatormanager:previous'),
+    nextPageText: t('amp.indicatormanager:next'),
+    lastPageText: t('amp.indicatormanager:last'),
+    nextPageTitle: t('amp.indicatormanager:next-page'),
+    prePageTitle: t('amp.indicatormanager:pre-page'),
+    firstPageTitle: t('amp.indicatormanager:first-page'),
+    lastPageTitle: t('amp.indicatormanager:last-page'),
     showTotal: true,
     sizePerPage: sizePerPage,
     hidePageListOnlyOnePage: true,
@@ -298,7 +300,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             >
                               <i className="fa fa-plus" />
                               {' '}
-                              <span>{translations['amp.dashboard:add-new']}</span>
+                              <span>{t('amp.dashboard:add-new')}</span>
                             </Button>
                             <Button
                                 variant="info"
@@ -307,7 +309,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             >
                               <i className="fa fa-tasks" />
                               {' '}
-                              <span>{translations['amp.dashboard:outcome-output-management'] || 'Outcome and Output Management'}</span>
+                              <span>{t('amp.dashboard:outcome-output-management')}</span>
                             </Button>
                             <Button
                                 variant="warning"
@@ -316,7 +318,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             >
                               <i className="fa fa-list" />
                               {' '}
-                              <span>{translations['amp.dashboard:disaggregation-management'] || 'Disaggregation Management'}</span>
+                              <span>{t('amp.dashboard:disaggregation-management')}</span>
                             </Button>
                             <ExportCSVButton
                                 {...props.csvProps}
@@ -324,7 +326,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             >
                               <i className="fa fa-download" />
                               {' '}
-                              <span>{translations['amp.indicatormanager:export-csv']}</span>
+                              <span>{t('amp.indicatormanager:export-csv')}</span>
                             </ExportCSVButton>
                           </div>
                         </Col>
@@ -335,11 +337,11 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             <Row className="justify-content-center">
                               <Col xs={12} md={6}>
                                 <div className={styles.search_item}>
-                                  <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:search']}</Form.Label>
+                                  <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:search')}</Form.Label>
                                   <div className={styles.search_wrapper}>
                                     <SearchBar
                                       {...props.searchProps}
-                                      placeholder={translations['amp.indicatormanager:search-placeholder'] || "Search by name or code"}
+                                      placeholder={t('amp.indicatormanager:search-placeholder')}
                                       className={styles.search_bar}
                                       style={{ width: '360px' }}
                                     />
@@ -350,7 +352,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                             </Row>
                             <Row xs={12}>
                             <div className={styles.filters_header}>
-                              <h5>{translations['amp.indicatormanager:filters'] || 'Filters'}</h5>
+                              <h5>{t('amp.indicatormanager:filters')}</h5>
                             </div>
                             </Row>
                             <Row className="g-2">
@@ -358,11 +360,11 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                               {filterBySector && (
                                   <Col xs={12} sm={6} lg={4}>
                                     <div className={styles.filter_item}>
-                                      <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:sectors']}</Form.Label>
+                                      <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:sectors')}</Form.Label>
                                       {sectorsReducer.sectors.length > 0 ? (
                                           <Select
                                               options={sectorOptions as any}
-                                              defaultValue={{ value: 0, label: translations['amp.indicatormanager:all-sectors'] }}
+                                              defaultValue={{ value: 0, label: t('amp.indicatormanager:all-sectors') }}
                                               className={styles.filter_select}
                                               onChange={(item: any) => setSelectedSector(item.value)}
                                               components={{ IndicatorSeparator: () => null }}
@@ -372,7 +374,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                                       ) : (
                                           <Select
                                               options={[]}
-                                              defaultValue={{ value: 0, label: translations['amp.indicatormanager:no-data'] }}
+                                              defaultValue={{ value: 0, label: t('amp.indicatormanager:no-data') }}
                                               isDisabled
                                               components={{ IndicatorSeparator: () => null }}
                                               className={styles.filter_select}
@@ -386,12 +388,12 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                               {filterByProgram && (
                                   <Col xs={12} sm={6} lg={4}>
                                     <div className={styles.filter_item}>
-                                      <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:programs']}</Form.Label>
+                                      <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:programs')}</Form.Label>
                                       {programOptions.length > 0 ? (
                                           <Select
                                               options={programOptions}
                                               formatGroupLabel={formatGroupLabel}
-                                              defaultValue={{ value: 0, label: translations['amp.indicatormanager:all-programs'] }}
+                                              defaultValue={{ value: 0, label: t('amp.indicatormanager:all-programs') }}
                                               className={styles.filter_select}
                                               onChange={(item: any) => setSelectedProgram(item.value)}
                                               components={{ IndicatorSeparator: () => null }}
@@ -401,7 +403,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                                       ) : (
                                           <Select
                                               options={[]}
-                                              defaultValue={{ value: 0, label: translations['amp.indicatormanager:no-data'] }}
+                                              defaultValue={{ value: 0, label: t('amp.indicatormanager:no-data') }}
                                               isDisabled
                                               components={{ IndicatorSeparator: () => null }}
                                               className={styles.filter_select}
@@ -414,9 +416,10 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
 
                               <Col xs={12} sm={6} lg={4}>
                                 <div className={styles.filter_item}>
-                                  <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:outcome']}</Form.Label>
+                                  <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:outcome')}</Form.Label>
                                   <Select
                                       options={outcomeOptions}
+                                      defaultValue={outcomeOptions[0]}
                                       onChange={(opt: any) => setSelectedOutcome(opt?.value || 0)}
                                       className={styles.filter_select}
                                       components={{ IndicatorSeparator: () => null }}
@@ -428,9 +431,10 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
 
                               <Col xs={12} sm={6} lg={4}>
                                 <div className={styles.filter_item}>
-                                  <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:output']}</Form.Label>
+                                  <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:output')}</Form.Label>
                                   <Select
                                       options={outputOptions}
+                                      defaultValue={outputOptions[0]}
                                       onChange={(opt: any) => setSelectedOutput(opt?.value || 0)}
                                       className={styles.filter_select}
                                       components={{ IndicatorSeparator: () => null }}
@@ -442,9 +446,10 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
 
                               <Col xs={12} sm={6} lg={4}>
                                 <div className={styles.filter_item}>
-                                  <Form.Label className={styles.filter_label}>{translations['amp.indicatormanager:indicator-type']}</Form.Label>
+                                  <Form.Label className={styles.filter_label}>{t('amp.indicatormanager:indicator-type')}</Form.Label>
                                   <Select
                                       options={indicatorTypeOptions}
+                                      defaultValue={indicatorTypeOptions[0]}
                                       onChange={(opt: any) => setSelectedIndicatorType(opt?.value || 0)}
                                       className={styles.filter_select}
                                       components={{ IndicatorSeparator: () => null }}
@@ -471,7 +476,7 @@ const SkeletonTable: React.FC<SkeletonTableProps> = (props) => {
                         filter={filterFactory(filterOptions)}
                         noDataIndication={() => (
                             <div className={styles.no_data}>
-                              <h5>{translations['amp.indicatormanager:no-data']}</h5>
+                              <h5>{t('amp.indicatormanager:no-data')}</h5>
                             </div>
                         )}
                     />
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/config/initialTranslations.json b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/config/initialTranslations.json
index bb2d9cc9864..0e537fe4797 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/config/initialTranslations.json
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/config/initialTranslations.json
@@ -27,7 +27,6 @@
   "amp.indicatormanager:no-data": "No Data Available",
   "amp.indicatormanager:all": "All",
   "amp.dashboard:add-new": "Add New Indicator",
-  "amp.dashboard:outcome-and-output-management": "Outcome and Output Management",
   "amp.indicatormanager:loading": "Loading",
   "amp.indicatormanager:indicator-name": "Indicator Name",
   "amp.indicatormanager:indicator-description": "Indicator Description",
@@ -117,8 +116,6 @@
   "amp.outcomeoutput:add-new-output": "Add New Output",
   "amp.outcomeoutput:export-csv": "Export CSV",
   "amp.outcomeoutput:search-placeholder": "Search Outcomes",
-  "amp.outcomeoutput:modal-title-outcome": "Add New Outcome",
-  "amp.outcomeoutput:modal-title-output": "Add New Output",
   "amp.outcomeoutput:management-title": "Outcome and Output Management",
   "amp.indicatormanager:core-info": "Core Indicator Information",
   "amp.indicatormanager:program-sector-info": "Program & Sector Information",
@@ -242,14 +239,14 @@
   "amp.indicatormanager:calculation-method-placeholder": "Describe how the indicator's value is calculated",
   "amp.indicatormanager:no-disaggregation-children": "No children found for this disaggregation.",
   "amp.indicatormanager:click-to-expand-collapse": "Click to expand/collapse",
-  "amp.indicatormanager:aria-base-original-value": "Base Original Value",
-  "amp.indicatormanager:aria-base-original-value-date": "Base Original Value Date",
-  "amp.indicatormanager:aria-base-revised-value": "Base Revised Value",
-  "amp.indicatormanager:aria-base-revised-value-date": "Base Revised Value Date",
-  "amp.indicatormanager:aria-target-original-value": "Target Original Value",
-  "amp.indicatormanager:aria-target-original-value-date": "Target Original Value Date",
-  "amp.indicatormanager:aria-target-revised-value": "Target Revised Value",
-  "amp.indicatormanager:aria-target-revised-value-date": "Target Revised Value Date",
   "amp.outcomeoutput:add-outputs": "Add Outputs",
-  "amp.outcomeoutput:edit-output": "Edit Output"
+  "amp.outcomeoutput:edit-output": "Edit Output",
+  "amp.indicatormanager:select-unit-of-measure": "Select Unit of Measure",
+  "amp.indicatormanager:select-frequency": "Select Frequency",
+  "amp.indicatormanager:select-indicator-type": "Select Indicator Type",
+  "amp.indicatormanager:aria-month": "Month",
+  "amp.indicatormanager:aria-day": "Day",
+  "amp.indicatormanager:aria-year": "Year",
+  "amp.indicatormanager:aria-clear-date": "Clear Date",
+  "amp.indicatormanager:aria-toggle-calendar": "Toggle Calendar"
 }
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/DisaggregationManagerPage.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/DisaggregationManagerPage.tsx
index 7e35701010f..8d37e40430f 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/DisaggregationManagerPage.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/DisaggregationManagerPage.tsx
@@ -12,10 +12,10 @@ interface CategoryValue {
   value: string;
   children?: CategoryValue[];
 }
-const translations = initialTranslations;
-
-
 const DisaggregationManagerPage: React.FC = () => {
+  const reduxTranslations = useSelector((state: any) => state.translationsReducer.translations);
+  const translations = (reduxTranslations && Object.keys(reduxTranslations).length > 0) ? reduxTranslations : initialTranslations;
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
   const [categories, setCategories] = useState<CategoryValue[]>([]);
   const [selectedCategory, setSelectedCategory] = useState<CategoryValue | null>(null);
   const [showModal, setShowModal] = useState(false);
@@ -81,17 +81,17 @@ const DisaggregationManagerPage: React.FC = () => {
   return (
     <div style={{ padding: '2rem' }}>
       <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '1.5rem' }}>
-        <h2 style={{ margin: 0 }}>{translations['amp.disaggregationmanager:title'] || 'Disaggregation Manager'}</h2>
+        <h2 style={{ margin: 0 }}>{t('amp.disaggregationmanager:title')}</h2>
         <Button variant="secondary" onClick={() => navigate('/admin/indicator_manager')} style={{ marginLeft: '10px' }}>
-          <i className="fa fa-arrow-left" /> {translations['amp.disaggregationmanager:back']}
+          <i className="fa fa-arrow-left" /> {t('amp.disaggregationmanager:back')}
         </Button>
       </div>
       <Table bordered hover>
         <thead>
           <tr>
-            <th>{translations['amp.disaggregationmanager:category'] || 'Disaggregation Category'}</th>
-            <th>{translations['amp.disaggregationmanager:options'] || 'Options'}</th>
-            <th>{translations['amp.disaggregationmanager:actions'] || 'Actions'}</th>
+            <th>{t('amp.disaggregationmanager:category')}</th>
+            <th>{t('amp.disaggregationmanager:options')}</th>
+            <th>{t('amp.disaggregationmanager:actions')}</th>
           </tr>
         </thead>
         <tbody>
@@ -108,7 +108,7 @@ const DisaggregationManagerPage: React.FC = () => {
                         size="sm"
                         style={{ marginLeft: 8, color: 'black', padding: '0 6px' }}
                         onClick={() => handleEditChild(category, child)}
-                        title={translations['amp.disaggregationmanager:edit'] || 'Edit'}
+                        title={t('amp.disaggregationmanager:edit')}
                       >
                         <i className="fa fa-pencil" />
                       </Button>
@@ -117,17 +117,17 @@ const DisaggregationManagerPage: React.FC = () => {
                         size="sm"
                         style={{ marginLeft: 4, color: 'red', padding: '0 6px' }}
                         onClick={() => handleDeleteChild(category, child)}
-                        title={translations['amp.disaggregationmanager:delete'] || 'Delete'}
+                        title={t('amp.disaggregationmanager:delete')}
                       >
                         <i className="fa fa-trash" />
                       </Button>
                     </li>
-                  )) : <span>{translations['amp.disaggregationmanager:no-options'] || 'No options'}</span>}
+                  )) : <span>{t('amp.disaggregationmanager:no-options')}</span>}
                 </ul>
               </td>
               <td>
                 <Button variant="success" size="sm" onClick={() => handleAddChild(category)}>
-                  {translations['amp.disaggregationmanager:add-option'] || 'Add Option'}
+                  {t('amp.disaggregationmanager:add-option')}
                 </Button>
               </td>
             </tr>
@@ -146,7 +146,7 @@ const DisaggregationManagerPage: React.FC = () => {
           size='lg'
       >
         <Modal.Header closeButton>
-          <Modal.Title>{modalMode === 'add' ? (translations['amp.disaggregationmanager:add-option'] || 'Add Option' + ':' + selectedCategory?.value) : (translations['amp.disaggregationmanager:edit-option-title'] || 'Edit Option' + ':' + selectedCategory?.value)}</Modal.Title>
+          <Modal.Title>{modalMode === 'add' ? (t('amp.disaggregationmanager:add-option') + ':' + selectedCategory?.value) : (t('amp.disaggregationmanager:edit-option-title') + ':' + selectedCategory?.value)}</Modal.Title>
         </Modal.Header>
         <Form
             onSubmit={async (e) => {
@@ -178,22 +178,22 @@ const DisaggregationManagerPage: React.FC = () => {
           <Modal.Body>
             <Form.Group className="mb-3">
               <Form.Label>
-                {translations['amp.disaggregationmanager:option-value'] || 'Option Value'}
+                {t('amp.disaggregationmanager:option-value')}
               </Form.Label>
               <Form.Control
                   name="childValue"
                   type="text"
                   defaultValue={editingChild ? editingChild.value : ''}
-                  placeholder={translations['amp.disaggregationmanager:option-value-placeholder'] || 'Enter option value'}
+                  placeholder={t('amp.disaggregationmanager:option-value-placeholder')}
               />
             </Form.Group>
           </Modal.Body>
           <Modal.Footer>
             <Button variant="secondary" onClick={() => setShowModal(false)}>
-              {translations['amp.disaggregationmanager:cancel'] || 'Cancel'}
+              {t('amp.disaggregationmanager:cancel')}
             </Button>
             <Button variant="primary" type="submit">
-              {translations['amp.disaggregationmanager:save'] || 'Save'}
+              {t('amp.disaggregationmanager:save')}
             </Button>
           </Modal.Footer>
         </Form>
diff --git a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/OutcomeOutputManagementPage.tsx b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/OutcomeOutputManagementPage.tsx
index db73c3457ac..a4f35f87e12 100644
--- a/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/OutcomeOutputManagementPage.tsx
+++ b/amp/TEMPLATE/reampv2/packages/reampv2-app/src/modules/admin/indicator_manager/pages/OutcomeOutputManagementPage.tsx
@@ -28,9 +28,10 @@ interface Output {
   description?: string; // Optional description for Output
 }
 
-const translations = initialTranslations;
-
 const OutcomeOutputManagementPage: React.FC = () => {
+  const reduxTranslations = useSelector((state: any) => state.translationsReducer.translations);
+  const translations = (reduxTranslations && Object.keys(reduxTranslations).length > 0) ? reduxTranslations : initialTranslations;
+  const t = (key: string): string => translations[key] ?? initialTranslations[key as keyof typeof initialTranslations] ?? key;
   const [showAddNewOutcomeModal, setShowAddNewOutcomeModal] = useState(false);
   const [showEditOutcomeModal, setShowEditOutcomeModal] = useState(false);
   const [showOutputModal, setShowOutputModal] = useState(false);
@@ -50,11 +51,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
   const columns = [
     {
       dataField: 'name',
-      text: translations['amp.outcomeoutput:outcome-name'],
+      text: t('amp.outcomeoutput:outcome-name'),
     },
     {
       dataField: 'actions',
-      text: translations['amp.outcomeoutput:actions'],
+      text: t('amp.outcomeoutput:actions'),
       formatter: (_: any, row: Outcome) => (
         <>
           <div className={action_style.action_container}
@@ -94,11 +95,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
       if (res.ok) {
         dispatch(getOutcomes());
       } else {
-        alert(translations['amp.outcomeoutput:add-outcome-failed']);
+        alert(t('amp.outcomeoutput:add-outcome-failed'));
       }
     } catch (e) {
       console.error('Error adding outcome', e);
-      alert(translations['amp.outcomeoutput:error-adding-outcome']);
+      alert(t('amp.outcomeoutput:error-adding-outcome'));
     }
   };
 
@@ -120,11 +121,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
       if (res.ok) {
         dispatch(getOutcomes());
       } else {
-        alert(translations['amp.outcomeoutput:update-outcome-failed']);
+        alert(t('amp.outcomeoutput:update-outcome-failed'));
       }
     } catch (e) {
       console.error('Error updating outcome', e);
-      alert(translations['amp.outcomeoutput:error-updating-outcome']);
+      alert(t('amp.outcomeoutput:error-updating-outcome'));
     }
     setShowEditOutcomeModal(false);
     setEditingOutcome(null);
@@ -137,11 +138,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
     // Call backend delete endpoint directly, and display any error/warning returned
     const confirm = await Swal.fire({
       icon: 'warning',
-      title: translations['amp.outcomeoutput:delete-outcome'],
-      html: `<div>${translations['amp.outcomeoutput:delete-outcome-confirm']} <b>${outcome.name}</b>?<br/>${translations['amp.outcomeoutput:delete-output-warning']}</div>`,
+      title: t('amp.outcomeoutput:delete-outcome'),
+      html: `<div>${t('amp.outcomeoutput:delete-outcome-confirm')} <b>${outcome.name}</b>?<br/>${t('amp.outcomeoutput:delete-output-warning')}</div>`,
       showCancelButton: true,
-      confirmButtonText: translations['amp.outcomeoutput:delete'],
-      cancelButtonText: translations['amp.outcomeoutput:cancel'],
+      confirmButtonText: t('amp.outcomeoutput:delete'),
+      cancelButtonText: t('amp.outcomeoutput:cancel'),
     });
     if (confirm.isConfirmed) {
       try {
@@ -154,7 +155,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
         } else {
           // Show backend error message (alerts/warnings)
           const error = await res.json();
-          let errorMsg = translations['amp.outcomeoutput:error-deleting-outcome'];
+          let errorMsg = t('amp.outcomeoutput:error-deleting-outcome');
           if (error && error.error) {
             const firstKey = Object.keys(error.error)[0];
             if (firstKey && error.error[firstKey] && error.error[firstKey][0]) {
@@ -163,15 +164,15 @@ const OutcomeOutputManagementPage: React.FC = () => {
           }
           await Swal.fire({
             icon: 'error',
-            title: translations['amp.outcomeoutput:cannot-delete-outcome'],
+            title: t('amp.outcomeoutput:cannot-delete-outcome'),
             html: errorMsg
           });
         }
       } catch (e) {
         await Swal.fire({
           icon: 'error',
-          title: translations['amp.outcomeoutput:error-deleting-output'],
-          text: translations['amp.outcomeoutput:unexpected-error']
+          title: t('amp.outcomeoutput:error-deleting-output'),
+          text: t('amp.outcomeoutput:unexpected-error')
         });
       }
     }
@@ -205,11 +206,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
         if (res.ok) {
           dispatch(getOutcomes());
         } else {
-          alert(translations['amp.outcomeoutput:update-output-failed']);
+          alert(t('amp.outcomeoutput:update-output-failed'));
         }
       } catch (e) {
         console.error('Error updating output', e);
-        alert(translations['amp.outcomeoutput:error-updating-output']);
+        alert(t('amp.outcomeoutput:error-updating-output'));
       }
     } else if (selectedOutcome) {
       // Add new output
@@ -225,11 +226,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
         if (res.ok) {
           dispatch(getOutcomes());
         } else {
-          alert(translations['amp.outcomeoutput:add-output-failed']);
+          alert(t('amp.outcomeoutput:add-output-failed'));
         }
       } catch (e) {
         console.error('Error adding output', e);
-        alert(translations['amp.outcomeoutput:error-adding-output']);
+        alert(t('amp.outcomeoutput:error-adding-output'));
       }
     }
     setShowOutputModal(false);
@@ -240,11 +241,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
     const handleDeleteOutput = async (output: Output) => {
         const confirm = await Swal.fire({
             icon: 'warning',
-            title: translations['amp.outcomeoutput:delete-output'],
-            html: `<div>${translations['amp.outcomeoutput:delete-output-confirm']} <b>${output.name}</b>?<br/>${translations['amp.outcomeoutput:delete-output-warning']}</div>`,
+            title: t('amp.outcomeoutput:delete-output'),
+            html: `<div>${t('amp.outcomeoutput:delete-output-confirm')} <b>${output.name}</b>?<br/>${t('amp.outcomeoutput:delete-output-warning')}</div>`,
             showCancelButton: true,
-            confirmButtonText: translations['amp.outcomeoutput:delete'],
-            cancelButtonText: translations['amp.outcomeoutput:cancel'],
+            confirmButtonText: t('amp.outcomeoutput:delete'),
+            cancelButtonText: t('amp.outcomeoutput:cancel'),
         });
         if (confirm.isConfirmed) {
             try {
@@ -256,7 +257,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
                     dispatch(getOutcomes())
                 } else {
                     const error = await res.json();
-                    let errorMsg = translations['amp.outcomeoutput:error-deleting-output'];
+                    let errorMsg = t('amp.outcomeoutput:error-deleting-output');
                     if (error && error.error) {
                         const firstKey = Object.keys(error.error)[0];
                         if (firstKey && error.error[firstKey] && error.error[firstKey][0]) {
@@ -266,11 +267,11 @@ const OutcomeOutputManagementPage: React.FC = () => {
                     if (errorMsg.includes('orphan')) {
                         const forceConfirm = await Swal.fire({
                             icon: 'warning',
-                            title: translations['amp.outcomeoutput:indicators-linked'],
-                            html: `${errorMsg}<br/><br/>${translations['amp.outcomeoutput:proceed-orphan-indicators']}`,
+                            title: t('amp.outcomeoutput:indicators-linked'),
+                            html: `${errorMsg}<br/><br/>${t('amp.outcomeoutput:proceed-orphan-indicators')}`,
                             showCancelButton: true,
-                            confirmButtonText: translations['amp.outcomeoutput:yes-delete-anyway'],
-                            cancelButtonText: translations['amp.outcomeoutput:cancel'],
+                            confirmButtonText: t('amp.outcomeoutput:yes-delete-anyway'),
+                            cancelButtonText: t('amp.outcomeoutput:cancel'),
                         });
                         if (forceConfirm.isConfirmed) {
                             try {
@@ -282,7 +283,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
                                     dispatch(getOutcomes())
                                 } else {
                                     const forceError = await forceRes.json();
-                                    let forceErrorMsg = translations['amp.outcomeoutput:error-deleting-output'];
+                                    let forceErrorMsg = t('amp.outcomeoutput:error-deleting-output');
                                     if (forceError && forceError.error) {
                                         const firstKey = Object.keys(forceError.error)[0];
                                         if (firstKey && forceError.error[firstKey] && forceError.error[firstKey][0]) {
@@ -291,22 +292,22 @@ const OutcomeOutputManagementPage: React.FC = () => {
                                     }
                                     await Swal.fire({
                                         icon: 'error',
-                                        title: translations['amp.outcomeoutput:cannot-delete-output'],
+                                        title: t('amp.outcomeoutput:cannot-delete-output'),
                                         html: forceErrorMsg
                                     });
                                 }
                             } catch (e) {
                                 await Swal.fire({
                                     icon: 'error',
-                                    title: translations['amp.outcomeoutput:error-deleting-output'],
-                                    text: translations['amp.outcomeoutput:unexpected-error']
+                                    title: t('amp.outcomeoutput:error-deleting-output'),
+                                    text: t('amp.outcomeoutput:unexpected-error')
                                 });
                             }
                         }
                     } else {
                         await Swal.fire({
                             icon: 'error',
-                            title: translations['amp.outcomeoutput:cannot-delete-output'],
+                            title: t('amp.outcomeoutput:cannot-delete-output'),
                             html: errorMsg
                         });
                     }
@@ -314,8 +315,8 @@ const OutcomeOutputManagementPage: React.FC = () => {
             } catch (e) {
                 await Swal.fire({
                     icon: 'error',
-                    title: translations['amp.outcomeoutput:error-deleting-output'],
-                    text: translations['amp.outcomeoutput:unexpected-error']
+                    title: t('amp.outcomeoutput:error-deleting-output'),
+                    text: t('amp.outcomeoutput:unexpected-error')
                 });
             }
         }
@@ -331,7 +332,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
             size="sm"
             style={{ marginLeft: '8px' }}
             onClick={() => handleAddOutput(row.id)}
-            title={translations['amp.outcomeoutput:add-outputs']}
+            title={t('amp.outcomeoutput:add-outputs')}
             onMouseOver={e => {
               e.currentTarget.setAttribute('data-bs-toggle', 'tooltip');
               e.currentTarget.setAttribute('data-bs-placement', 'top');
@@ -345,13 +346,13 @@ const OutcomeOutputManagementPage: React.FC = () => {
             {row.description}
           </div>
         )}
-        <strong>{translations['amp.outcomeoutput:outputs']}:</strong>
+        <strong>{t('amp.outcomeoutput:outputs')}:</strong>
         <table style={{ marginLeft: '1.5rem', width: '100%' }}>
           <thead>
             <tr>
-              <th>{translations['amp.outcomeoutput:name']}</th>
-              <th>{translations['amp.outcomeoutput:description']}</th>
-              <th>{translations['amp.outcomeoutput:actions']}</th>
+              <th>{t('amp.outcomeoutput:name')}</th>
+              <th>{t('amp.outcomeoutput:description')}</th>
+              <th>{t('amp.outcomeoutput:actions')}</th>
             </tr>
           </thead>
           <tbody>
@@ -365,7 +366,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
                     size="sm"
                     style={{ marginRight: '6px' }}
                     onClick={() => handleEditOutput(output, row)}
-                    title={translations['amp.outcomeoutput:edit-output']}
+                    title={t('amp.outcomeoutput:edit-output')}
                   >
                     <i className="fa fa-pencil" />
                   </Button>
@@ -373,13 +374,13 @@ const OutcomeOutputManagementPage: React.FC = () => {
                     variant="outline-danger"
                     size="sm"
                     onClick={() => handleDeleteOutput(output)}
-                    title={translations['amp.outcomeoutput:delete-output']}
+                    title={t('amp.outcomeoutput:delete-output')}
                   >
                     <i className="fa fa-trash" />
                   </Button>
                 </td>
               </tr>
-            )) : <tr><td colSpan={3}>{translations['amp.outcomeoutput:no-outputs']}</td></tr>}
+            )) : <tr><td colSpan={3}>{t('amp.outcomeoutput:no-outputs')}</td></tr>}
           </tbody>
         </table>
       </div>
@@ -399,7 +400,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
       { text: '10', value: 10 },
       { text: '25', value: 25 },
       { text: '50', value: 50 },
-      { text: translations['amp.indicatormanager:all'], value: outcomes.length }
+      { text: t('amp.indicatormanager:all'), value: outcomes.length }
     ],
     sizePerPage: 10
   };
@@ -432,7 +433,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
       <Col sm={12}>
         <Row className={styles.table_header}>
           <Col sm={6}>
-            <h3>{translations['amp.outcomeoutput:outcome-management']}</h3>
+            <h3>{t('amp.outcomeoutput:outcome-management')}</h3>
           </Col>
           <Col sm={6}>
           </Col>
@@ -451,20 +452,20 @@ const OutcomeOutputManagementPage: React.FC = () => {
                   <div className={styles.table_header_bottom_left}>
                     {' '}
                     <Button variant="primary" onClick={() => setShowAddNewOutcomeModal(true)}>
-                      <i className="fa fa-plus" /> {translations['amp.outcomeoutput:add-new-outcome']}
+                      <i className="fa fa-plus" /> {t('amp.outcomeoutput:add-new-outcome')}
                     </Button>
                     {' '}
                     <ExportCSVButton {...props.csvProps} className={styles.export_button}>
-                      <i className="fa fa-download" /> {translations['amp.outcomeoutput:export-csv']}
+                      <i className="fa fa-download" /> {t('amp.outcomeoutput:export-csv')}
                     </ExportCSVButton>
                   </div>
                 </Col>
                 <Col sm={8}>
                     <div className={styles.search_container}>
-                      <SearchBar {...props.searchProps} placeholder={translations['amp.outcomeoutput:search-placeholder']} />
+                      <SearchBar {...props.searchProps} placeholder={t('amp.outcomeoutput:search-placeholder')} />
                     </div>
                   <Button variant="secondary" onClick={() => navigate('/admin/indicator_manager')} style={{ float: 'right', marginLeft: '10px' }}>
-                    <i className="fa fa-arrow-left" /> {translations['amp.outcomeoutput:back']}
+                    <i className="fa fa-arrow-left" /> {t('amp.outcomeoutput:back')}
                   </Button>
                 </Col>
               </Row>
@@ -478,7 +479,7 @@ const OutcomeOutputManagementPage: React.FC = () => {
                 pagination={paginationFactory(paginationOptions)}
                 noDataIndication={() => (
                     <div className={styles.no_data}>
-                      <h5>{translations['amp.indicatormanager:no-data']}</h5>
+                      <h5>{t('amp.indicatormanager:no-data')}</h5>
                     </div>
                 )}
               />
diff --git a/amp/src/main/java/org/digijava/kernel/ampapi/endpoints/indicator/manager/AmpCategoryValueDTO.java b/amp/src/main/java/org/digijava/kernel/ampapi/endpoints/indicator/manager/AmpCategoryValueDTO.java
index 7de10ec6c32..ea63a37bf35 100644
--- a/amp/src/main/java/org/digijava/kernel/ampapi/endpoints/indicator/manager/AmpCategoryValueDTO.java
+++ b/amp/src/main/java/org/digijava/kernel/ampapi/endpoints/indicator/manager/AmpCategoryValueDTO.java
@@ -2,6 +2,7 @@
 
 import com.fasterxml.jackson.annotation.JsonProperty;
 import com.fasterxml.jackson.annotation.JsonPropertyOrder;
+import org.digijava.kernel.translator.TranslatorWorker;
 import org.digijava.module.categorymanager.dbentity.AmpCategoryClass;
 import org.digijava.module.categorymanager.dbentity.AmpCategoryValue;
 
@@ -30,7 +31,7 @@ public AmpCategoryValueDTO() {
 
     public AmpCategoryValueDTO(final AmpCategoryValue ampCategoryValue) {
         this.id = ampCategoryValue.getId();
-        this.value = ampCategoryValue.getValue();
+        this.value = TranslatorWorker.translateText(ampCategoryValue.getValue());
         this.ampCategoryClass = ampCategoryValue.getAmpCategoryClass();
         this.index = ampCategoryValue.getIndex();
         this.deleted = ampCategoryValue.getDeleted();