Styled Table Cell - Copy this React, Mui Component to your project

Design an application to show an editable data table with the following columns: Progetto, capacita_magazzino (integer), Materiale, Tipologia, t0 (integer), t1 (integer), t2 (integer), t3 (integer), t4 (integer), t5 (integer), t6 (integer), t7 (integer), t8 (integer), t9 (integer), t10 (integer), t11 (integer) based on data table, i have to write a json file with a content similar to this: [ { "progetto": "CANTIERE_1", "capacita_magazzino": 20, "sabbia": { "produzione": [ 9, 12, 3, 21, 18, 23, 6, 1, 15, 10, 7, 16 ], "bisogno": [ 21, 14, 12, 0, 1, 28, 23, 18, 12, 6, 17, 15 ], "magazzino": [ 0 ] }, "argilla": { "produzione": [ 13, 14, 8, 14, 26, 0, 9, 20, 9, 26, 0, 19 ], "bisogno": [ 10, 8, 12, 18, 8, 6, 20, 6, 29, 11, 29, 1 ], "magazzino": [ 8 ] }, "ghiaia": { "produzione": [ 27, 15, 7, 8, 29, 23, 9, 21, 8, 1, 2, 17 ], "bisogno": [ 0, 4, 25, 17, 8, 11, 2, 4, 8, 16, 6, 8 ], "magazzino": [ 7 ] } }, { "progetto": "CANTIERE_2", "capacita_magazzino": 0, "sabbia": { "produzione": [ 10, 20, 12, 15, 19, 5, 16, 29, 23, 9, 9, 4 ], "bisogno": [ 10, 16, 14, 6, 25, 21, 28, 21, 18, 24, 19, 2 ], "magazzino": [ 0 ] }, "argilla": { "produzione": [ 19, 11, 7, 9, 20, 10, 5, 23, 27, 12, 15, 6 ], "bisogno": [ 28, 3, 26, 22, 6, 22, 26, 28, 18, 27, 16, 0 ], "magazzino": [ 0 ] }, "ghiaia": { "produzione": [ 25, 17, 14, 21, 2, 14, 15, 14, 3, 4, 25, 12 ], "bisogno": [ 13, 15, 18, 25, 20, 2, 0, 20, 16, 16, 12, 20 ], "magazzino": [ 0 ] } }, { "progetto": "CANTIERE_3", "capacita_magazzino": 0, "sabbia": { "produzione": [ 29, 17, 7, 20, 6, 6, 24, 21, 8, 17, 26, 12 ], "bisogno": [ 28, 0, 15, 29, 0, 15, 14, 12, 17, 20, 9, 15 ], "magazzino": [ 0 ] }, "argilla": { "produzione": [ 4, 8, 3, 1, 6, 11, 19, 19, 2, 22, 7, 19 ], "bisogno": [ 26, 15, 9, 4, 0, 29, 8, 8, 20, 29, 8, 18 ], "magazzino": [ 0 ] }, "ghiaia": { "produzione": [ 18, 23, 0, 22, 2, 8, 29, 4, 29, 29, 25, 24 ], "bisogno": [ 22, 20, 27, 3, 29, 16, 22, 12, 26, 26, 12, 27 ], "magazzino": [ 0 ] } }, { "progetto": "S", "capacita_magazzino": 800000000000, "sabbia": { "produzione": [ 0, 0,0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "bisogno": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "magazzino": [ 0 ] }, "argilla": { "produzione": [ 0, 0,0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "bisogno": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "magazzino": [ 0 ] }, "ghiaia": { "produzione": [ 0, 0,0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "bisogno": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "magazzino": [ 0 ] } }, { "progetto": "F", "capacita_magazzino": 800000000000, "sabbia": { "produzione": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "bisogno": [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], "magazzino": [ 8000000000 ] }, "argilla": { "produzione": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0, 0, 0 ], "bisogno": [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], "magazzino": [ 8000000000 ] }, "ghiaia": { "produzione": [ 0, 0, 0, 0,0, 0, 0, 0, 0, 0,0, 0 ], "bisogno": [ 0, 0, 0, 0, 0, 0 ,0, 0, 0, 0, 0, 0 ], "magazzino": [ 8000000000 ] } } ]