feat: make improvements to org table (#10679)

### What
- added responsiveness to the table by making it horizontally
scrollable.
- added custom visibility option, so users can choose which column they
want to see/not see on the table.
- updated `templates/web/common/site_layout.tt.html` file to include a
link only visible to admins and moderators in the homepage menu, this
link leads to the organization table page.
- updated `/cgi/display_org_table.pl` file to persist search queries
values in the form after submission.
- replaced `creator` field with `creator_email`
- created a script that populates the creator email for existing orgs


### Screenshot
<img width="1432" alt="Screenshot 2024-08-12 at 9 33 25 AM"
src="https://github.com/user-attachments/assets/05337e60-3670-445e-b84d-c0df001f6be7">




<img width="1422" alt="Screenshot 2024-08-12 at 9 33 41 AM"
src="https://github.com/user-attachments/assets/8e0387d4-012c-4562-8928-fc291758b2ce">

---------

Co-authored-by: Stéphane Gigandet <stephane@openfoodfacts.org>

cgi/display_org_table.pl

@@ -54,11 +54,14 @@
 $query_ref->{name} = qr/\Q$name\E/i if defined $name && $name ne '';
 $query_ref->{valid_org} = $valid_org if defined $valid_org && $valid_org ne '';
 
+$template_data_ref->{name} = $name;
+$template_data_ref->{valid_org} = $valid_org;
 $template_data_ref->{query_filters} = [] unless defined $template_data_ref->{query_filters};
 
 @orgs = $orgs_collection->find($query_ref)->sort({created_t => -1})->all;
 
-$template_data_ref = {orgs => \@orgs, has_orgs => scalar @orgs > 0};
+$template_data_ref->{orgs} = \@orgs;
+$template_data_ref->{has_orgs} = scalar @orgs > 0;
 
 my $html;
 process_template('web/pages/dashboard/display_orgs_table.tt.html', $template_data_ref, \$html) or $html = '';
@@ -73,22 +76,45 @@
 		info: "_TOTAL_ labels",
 		infoFiltered: " - out of _MAX_"
     },
-	paging: false,
+	paging: true,
 	order: [[ 0, "asc" ]],
+	scrollX: true,
+	dom: 'Bfrtip',
+	buttons: [
+        {
+            extend: 'colvis',
+            text: 'Column visibility',
+            columns: ':gt(1)'
+        }
+    ]
 });
 JS
 	;
 
 $request_ref->{scripts} .= <<SCRIPTS
-<script src="https://static.openfoodfacts.org/js/datatables.min.js"></script>
+<script src="$static_subdomain/js/datatables.min.js"></script>
 SCRIPTS
 	;
 
 $request_ref->{header} .= <<HEADER
-<link rel="stylesheet" href="https://static.openfoodfacts.org/js/datatables.min.css">
+<link rel="stylesheet" href="$static_subdomain/js/datatables.min.css">
+<style>
+   /* Custom styling for the column visibility buttons */
+   .dt-button-collection .dt-button.active::before {
+       content: "✔";
+       display: inline-block;
+       margin-right: 6px;
+   }
+
+   .dt-button-collection .dt-button::before {
+       content: " ";
+       display: inline-block;
+       margin-right: 6px;
+   }
+</style>
 HEADER
 	;
 
-$request_ref->{title} = "Organization List";
+$request_ref->{title} = lang("organization_list");
 $request_ref->{content_ref} = \$html;
 display_page($request_ref);