Added translation for en & sr

src/components/Docs/DocsFilters.js

 } from "../../store/actions/files/fileActions";
 import { useParams } from "react-router-dom";
 import { PAGE_SIZE_FILES } from "../../constants/keyCodeConstants";
+import { useTranslation } from "react-i18next";
 
 const DocsFilters = ({ open, handleClose, setPage, setFile }) => {
   const dispatch = useDispatch();
   const { filters } = useSelector((s) => s.fileFilters);
   let { id } = useParams();
+  const { t } = useTranslation();
 
   const handleCheckboxesExt = (e) =>
     dispatch(updateFileFilterExt(e.target.value));
             <div className="ad-filters-header">
               <img src={filterIcon} alt="filter_icon" />
               {/* <h3>{t("filters.filters")}</h3> */}
-              <h3>Filteri</h3>
+              <h3>{t("files.filters")}</h3>
               <p>
                 {/* <sub>| {t("ads.ads")}</sub> */}
-                <sub>| Dokumenti</sub>
+                <sub>{t("files.documents")}</sub>
               </p>
             </div>
             <div className="ad-filters-header-close" onClick={handleClose}>
             style={{ paddingTop: "30px" }}
             className="custom-drawer-sub-card-label"
           >
-            <p>Ekstenzija</p>
+            <p>{t("files.extension")}</p>
           </div>
           <div className="ad-filters-technologies-checkboxes">
             <FormGroup>
             style={{ paddingTop: "10px" }}
             className="custom-drawer-sub-card-label"
           >
-            <p>Tagovi</p>
+            <p>{t("files.tags")}</p>
           </div>
           <div className="ad-filters-technologies-checkboxes">
             <FormGroup>
             className="c-btn c-btn--primary"
             data-testid="custom-drawer-submit-search"
           >
-            {/* {t("common.search")} */}
-            Pretraži
+            {t("files.search")}
           </button>
         </div>
       </form>

src/i18n/resources/en.js

     positionNotDeclared:"Position has not been declared yet.",
     backToUsers: "Back to list of users",
     noSocialMedia:"User takes not part in any social media.",
-    noPhoneNumber:"User has no phone number saved."
+    noPhoneNumber:"User has no phone number saved.",
+    grantedCategories: "Granted categories",
+    applyChanges: "Apply changes",
   },
   selectionLevels: {
     done: {
     registered:"Registered by positions"
   },
   files: {
-    addFile: "Add File"
+    addFile: "Add File",
+    addFileCategories: "Categories",
+    addFileSelectedCategory: "Selected Category",
+    addFileSetRoot: "Set root",
+    addFileTags: "Tags",
+    addFileDragAndDrop: "Drag & Drop File",
+    addFileSuccessfullyAddedFile: "Successfully added file",
+    addFileGoBackToFiles: "Go back to all files",
+    createCategoryModalTitle: "Create category",
+    createCategoryModalPlaceholder: "Category name",
+    close: "Close",
+    createCategoryModalSubmitButton: "Create category",
+    folders: "Folders",
+    file: "File",
+    files: "Files",
+    category: "Category",
+    root: "Root",
+    confirmDialogTitle: "Deleting document",
+    confirmDialogContent: "Are you sure for deleting document?",
+    editText: "Edit text",
+    editTextSub: " | Note",
+    saveChanges: "Save changes",
+    doucmentPath: "Document path",
+    doucmentName: "Document name",
+    doucmentType: "Document type",
+    doucmentSize: "Document size",
+    deleteDocument: "Delete document",
+    note: "Note",
+    downloadDocument: "Download document",
+    filters: "Filters",
+    documents: "| Documents",
+    extension: "Extension",
+    tags: "Tags",
+    search: "Search"
   }
 };

src/i18n/resources/rs.js

     statistics: "Statistika",
     users: "Korisnici",
     signOut: "Izloguj se",
-    files:"Fajlovi"
+    files: "Fajlovi",
   },
   ads: {
     activeAds: "Aktivni Oglasi",
     duties: "Glavna zaduženja",
     conditions: "Uslovi",
     offer: "Šta nudimo",
-    archivingAds:"Arhiviranje oglasa",
-    archivingAdQuestion:"Da li ste sigurni da želite da arhivirate oglas?",
+    archivingAds: "Arhiviranje oglasa",
+    archivingAdQuestion: "Da li ste sigurni da želite da arhivirate oglas?",
   },
   // selection: {
   //   title: "Tok Selekcije",
     backToUsers: "Nazad na listu korisnika",
     noSocialMedia: "Korisnik nije deo nijedne društvene mreže.",
     noPhoneNumber: "Korisnik nema sacuvan broj telefona.",
+    grantedCategories: "Dodeljene kategorije",
+    applyChanges: "Primenite promene",
   },
   filter: {
     title: "Filteri",
     tableView: "Tablični prikaz",
     search: "Pretraga",
     position: "Pozicija",
-    deleteCandidate:"Brisanje kandidata",
-    deleteCandidateQuestion:"Da li ste sigurni da želite da obrišete kandidata?"
+    deleteCandidate: "Brisanje kandidata",
+    deleteCandidateQuestion:
+      "Da li ste sigurni da želite da obrišete kandidata?",
   },
   dialogs: {
     candidateName: "Ime kandidata",
     noInterviewer: "Proces nema intervjuera.",
     title: "Tok selekcije",
     subtitle: "Svi kandidati",
-    addInterviewer:"Dodavanje intervjuera",
-    selection:"Selekcija",
-    changeInterviewer:"Promena intervjuera",
-    addCandidate:"Dodavanje kandidata",
-    interview:"HR intervju",
-    filterDate:"Datum"
+    addInterviewer: "Dodavanje intervjuera",
+    selection: "Selekcija",
+    changeInterviewer: "Promena intervjuera",
+    addCandidate: "Dodavanje kandidata",
+    interview: "HR intervju",
+    filterDate: "Datum",
   },
   patterns: {
     made: "Napravljen",
     patternsMade: "Napravljeni Šabloni",
     noPatterns: "Trenutno nema dodatih sablona",
     addPattern: "Dodaj Šablon",
-    editing2:"Režim uređivanja"
+    editing2: "Režim uređivanja",
   },
   stats: {
     statistic: "Statistika",
     registered: "Prijavljeni po pozicijama",
   },
   files: {
-    addFile: "Dodajte Fajl"
-  }
+    addFile: "Dodajte Fajl",
+    addFileCategories: "Kategorije",
+    addFileSelectedCategory: "Izabrana kategorija",
+    addFileSetRoot: "Podesite koren",
+    addFileTags: "Tagovi",
+    addFileDragAndDrop: "Prevucite fajl",
+    addFileSuccessfullyAddedFile: "Uspešno dodat fajl",
+    addFileGoBackToFiles: "Nazad na sve fajlove",
+    createCategoryModalTitle: "Napravite kategoriju",
+    createCategoryModalPlaceholder: "Naziv kategorije",
+    close: "Izađite",
+    createCategoryModalSubmitButton: "Napravite kategoriju",
+    folders: "Folderi",
+    file: "Fajl",
+    files: "Fajlovi",
+    category: "Kategorija",
+    root: "Koren",
+    confirmDialogTitle: "Brisanje dokumenta",
+    confirmDialogContent: "Da li ste sigurni za brisanje dokumenta?",
+    editText: "Izmena teksta",
+    editTextSub: " | Beleška",
+    saveChanges: "Sačuvajte izmene",
+    doucmentPath: "Putanja dokumenta",
+    doucmentName: "Naziv dokumenta",
+    doucmentType: "Tip dokumenta",
+    doucmentSize: "Veličina dokumenta",
+    deleteDocument: "Obrišite dokument",
+    note: "Beleška",
+    downloadDocument: "Preuzmite dokument",
+    filters: "Filteri",
+    documents: "| Dokumenti",
+    extension: "Ekstenzija",
+    tags: "Tagovi",
+    search: "Pretraži"
+  },
 };

src/pages/FilesPage/AddFile.js

     setTitle("");
     setShowMessage(true);
     setSelectedCategory({ id: -1, name: "" });
-    setDropzoneActive(false)
+    setDropzoneActive(false);
   };
 
   useEffect(() => {
   return (
     <div
       className="uploadCV-input files-page-drag-and-drop"
-      style={{backgroundColor: !pdfFile && dropzoneActive === true ? "#F4F4F4" : "#ffffff"}}
+      style={{
+        backgroundColor:
+          !pdfFile && dropzoneActive === true ? "#F4F4F4" : "#ffffff",
+      }}
       onDragOver={(e) => {
         setDropzoneActive(true);
         e.preventDefault();
 
         <div className="files-page-card">
           <div className="files-page-card-title">
-            <h1>Categories</h1>
+            <h1>{t("files.addFileCategories")}</h1>
           </div>
           <div className="files-page-card-content">
             <TreeViewFiles onSelectCategory={selectCategoryHandler} />
 
         <div className="files-page-card">
           <div className="files-page-card-title">
-            <h1>Selected Category</h1>
+            <h1>{t("files.addFileSelectedCategory")}</h1>
           </div>
           <div className="files-page-card-input">
             <input
               type="text"
               disabled={true}
-              value={
-                selectedCategory.id !== -1 ? selectedCategory.name : ""
-              }
+              value={selectedCategory.id !== -1 ? selectedCategory.name : ""}
             />
             <Button
               type="button"
               onClick={() => setSelectedCategory({ id: -1, name: "" })}
               disabled={selectedCategory.id === -1}
             >
-              Set root
+              {t("files.addFileSetRoot")}
             </Button>
           </div>
         </div>
 
         <div className="files-page-card">
           <div className="files-page-card-title">
-            <h1>Tags</h1>
+            <h1>{t("files.addFileTags")}</h1>
           </div>
           <div className="files-page-card-content">
             <div className="files-page-card-content-checkboxes">
 
         <div className="files-page-card">
           <div className="files-page-card-title">
-            <h1>Drag & Drop File</h1>
+            <h1>{t("files.addFileDragAndDrop")}</h1>
           </div>
           <div
             className="files-page-card-content drag-and-drop"
             showMessage === false ? { display: "none" } : { display: "flex" }
           }
         >
-          <p>Uspesno dodat fajl</p>
+          <p>{t("files.addFileSuccessfullyAddedFile")}</p>
         </div>
 
         <div className="files-page-card">
               className="applicant-ads-back-button"
               onClick={() => history.push(FILES_PAGE)}
             >
-              Nazad na sve fajlove
+              {t("files.addFileGoBackToFiles")}
             </p>
             <IconButton
               className="c-btn ads-page-btn c-btn--primary add-ad-btn"

src/pages/FilesPage/FileTable.js

     <div>
       <ConfirmDialog
         open={fileForDelete.open}
-        title="Brisanje dokumenta"
+        title={t("files.confirmDialogTitle")}
         subtitle={fileForDelete.title}
         imgSrc={deleteIcon}
-        content="Da li ste sigurni za brisanje dokumenta?"
+        content={t("files.confirmDialogContent")}
         onClose={() => {
           setFileForDelete({ open: false, title: "", streamId: null });
         }}
               <img src={editIcon} alt="plus" />
             </div>
             <div className="add-pattern-modal-header-title-title">
-              <p>Edit text</p>
+              <p>{t("files.editText")}</p>
             </div>
             <div className="add-pattern-modal-header-title-sub">
-              <sub> | Note</sub>
+              <sub>{t("files.editTextSub")}</sub>
             </div>
           </div>
           <div
               setOpenNoteModal({ open: false, note: null, streamId: "" })
             }
           >
-            Close
+            {t("files.close")}
           </Button>
           <Button
             type="button"
             className="c-btn c-btn--primary"
             onClick={updateFileNoteHandler}
           >
-            Save Changes
+            {t("files.saveChanges")}
           </Button>
         </div>
       </CustomModal>
                   className="headingRow headingRowFiles"
                   style={{ cursor: "pointer" }}
                 >
-                  {file === null ? <th>Putanja dokumenta</th> : ""}
-                  <th>Naziv dokumenta</th>
-                  {file === null ? <th>Tip dokumenta</th> : ""}
-                  {file === null ? <th>Veličina dokumenta</th> : ""}
-                  {file === null ? <th>Obrisi dokument</th> : ""}
-                  {file === null ? <th>Note</th> : ""}
-                  <th>Preuzmi dokument</th>
+                  {file === null ? <th>{t("files.doucmentPath")}</th> : ""}
+                  <th>{t("files.doucmentName")}</th>
+                  {file === null ? <th>{t("files.doucmentType")}</th> : ""}
+                  {file === null ? <th>{t("files.doucmentSize")}</th> : ""}
+                  {file === null ? <th>{t("files.deleteDocument")}</th> : ""}
+                  {file === null ? <th>{t("files.note")}</th> : ""}
+                  <th>{t("files.downloadDocument")}</th>
                 </tr>
               </thead>
               <tbody>

src/pages/FilesPage/FilesPage.js

 import Button from "../../components/Button/Button";
 import { useTheme } from "@mui/system";
 import { useMediaQuery } from "@mui/material";
+import { useTranslation } from "react-i18next";
 
 const FilesPage = ({ history }) => {
   const categories = useSelector(selectCategories);
   let { id } = useParams();
   const theme = useTheme();
   const matches = useMediaQuery(theme.breakpoints.down("370"));
+  const { t } = useTranslation();
 
   useEffect(() => {
     if (id === undefined) {
               <img src={plusIcon} alt="plus" />
             </div>
             <div className="add-pattern-modal-header-title-title">
-              <p>Create category</p>
+              <p>{t("files.createCategoryModalTitle")}</p>
             </div>
           </div>
           <div
         <div className="add-category-input">
           <input
             type="text"
-            placeholder="Category name"
+            placeholder={t("files.createCategoryModalPlaceholder")}
             value={createCategoryName}
             onChange={(e) => setCreateCategoryName(e.target.value)}
           />
             className="c-btn c-btn--primary-outlined"
             onClick={changeOpenCreateCategoryModal}
           >
-            Close
+            {t("files.close")}
           </Button>
           <Button
             type="button"
             className="c-btn c-btn--primary"
             onClick={createCategoryHandler}
           >
-            Create category
+            {t("files.createCategoryModalSubmitButton")}
           </Button>
         </div>
       </CustomModal>
                 marginBottom: "15px",
               }}
             >
-              <h1 className="page-heading">Folderi</h1>
+              <h1 className="page-heading">{t("files.folders")}</h1>
               <div className="add-categories-files">
                 <IconButton
                   className={
                   }
                   onClick={() => history.push(ADD_FILE)}
                 >
-                  + Fajl
+                  + {t("files.file")}
                 </IconButton>
                 <IconButton
                   className={
                   }
                   onClick={changeOpenCreateCategoryModal}
                 >
-                  + Kategorija
+                  + {t("files.category")}
                 </IconButton>
               </div>
             </div>
                 onClick={() => history.push({ pathname: FILES_PAGE })}
                 className="files-file-routing"
               >
-                Root
+                {t("files.root")}
               </div>
               {childParentRelations.map((relation) => (
                 <div
 
         <div>
           <div style={{ marginBottom: "0px" }}>
-            <h1 className="page-heading">Fajlovi</h1>
+            <h1 className="page-heading">{t("files.files")}</h1>
           </div>
           <div className="files-page-categories">
             <FileTable trigger={trigger} />

src/pages/UsersPage/UserDetails.js

                     marginTop: matches ? "1rem" : "0px",
                   }}
                 >
-                  <h1>Granted Categories</h1>
+                  <h1>{t("users.grantedCategories")}</h1>
                 </div>
                 <div className="user-details-middle-checkboxes">
                   <FormGroup>
                       type="submit"
                       onClick={onGrantCategoriesHandler}
                     >
-                      Apply Changes
+                      {t("users.applyChanges")}
                     </Button>
                   </div>
                   {matches && (