Add support for filtering mod logs

src/assets/css/main.css

@@ -375,6 +375,10 @@ br.big {
   border-radius: 4px;
 }
 
+.default-font-size {
+  font-size: .9375rem !important;
+}
+
 .preview-lines {
   overflow: hidden;
   text-overflow: ellipsis;

src/shared/components/common/dropdown.tsx

@@ -0,0 +1,52 @@
+import { Component, linkEvent } from "inferno";
+
+interface DropdownProps {
+  button: any
+  children: any
+}
+
+interface DropdownState {
+  showDropdown : boolean
+}
+
+export class Dropdown extends Component<DropdownProps, DropdownState> {
+  private emptyState: DropdownState = {
+    showDropdown: false,
+  };
+
+  constructor(props: any, context: any) {
+    super(props, context);
+    this.state = this.emptyState;
+  }
+
+  render() {
+    return (
+      <>
+        <span className="dropdown">
+        <button className="btn btn-link dropdown-toggle" 
+                onClick={linkEvent(this, this.handleToggleDropdown)}
+                role="button"
+                type="button"
+                aria-expanded="false">{this.props.button}</button>
+        {this.state.showDropdown && (
+        <div
+          class="dropdown-content navbar-nav"
+          onMouseLeave={linkEvent(
+            this,
+            this.handleToggleDropdown
+          )}
+        >
+          {this.props.children}
+        </div>
+        )}
+        </span>
+      </>
+    );
+  }
+
+  handleToggleDropdown(i: Dropdown, event: any) {
+    event.preventDefault();
+    i.state.showDropdown = !i.state.showDropdown;
+    i.setState(i.state);
+  }
+}

src/shared/components/home/site-form.tsx

@@ -44,6 +44,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
       default_post_listing_type: null,
       legal_information: null,
       auth: authField(false),
+      hide_modlog_mod_names: true,
     },
     loading: false,
     themeList: [],
@@ -86,6 +87,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
         default_theme: site.default_theme,
         default_post_listing_type: site.default_post_listing_type,
         legal_information: site.legal_information,
+        hide_modlog_mod_names: site.hide_modlog_mod_names,
         auth: authField(false),
       };
     }
@@ -394,7 +396,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
                   class="form-check-input"
                   id="create-site-private-instance"
                   type="checkbox"
-                  value={this.state.siteForm.default_theme}
+                  checked={this.state.siteForm.private_instance}
                   onChange={linkEvent(this, this.handleSitePrivateInstance)}
                 />
                 <label
@@ -406,6 +408,25 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
               </div>
             </div>
           </div>
+          <div class="form-group row">
+            <div class="col-12">
+              <div class="form-check">
+                <input
+                  class="form-check-input"
+                  id="create-site-hide-modlog-mod-names"
+                  type="checkbox"
+                  checked={this.state.siteForm.hide_modlog_mod_names}
+                  onChange={linkEvent(this, this.handleSiteHideModlogModNames)}
+                />
+                <label
+                  class="form-check-label"
+                  htmlFor="create-site-hide-modlog-mod-names"
+                >
+                  {i18n.t("hide_modlog_mod_names")}
+                </label>
+              </div>
+            </div>
+          </div>
           <div class="form-group row">
             <div class="col-12">
               <button
@@ -513,6 +534,11 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
     i.setState(i.state);
   }
 
+  handleSiteHideModlogModNames(i: SiteForm, event: any) {
+    i.state.siteForm.hide_modlog_mod_names = event.target.checked;
+    i.setState(i.state);
+  }
+
   handleSiteDefaultTheme(i: SiteForm, event: any) {
     i.state.siteForm.default_theme = event.target.value;
     i.setState(i.state);