Set server list to show all categories by default. Fixes #766 (#767)

Signed-off-by: Andy Piper <andypiper@users.noreply.github.com>
mastodon · Sep 2, 2024 · 1f3e938 · 1f3e938
1 parent 063c9e1
commit 1f3e938
Showing 1 changed file with 60 additions and 60 deletions.
diff --git a/pages/servers.tsx b/pages/servers.tsx
@@ -35,7 +35,7 @@ const Servers = () => {
   const { locale } = useRouter()
   const [filters, setFilters] = useState({
     language: locale === "en" ? "en" : "",
-    category: "general",
+    category: "",
     region: "",
     ownership: "",
     registrations: "",
@@ -469,23 +469,23 @@ const ServerList = ({ servers }) => {
         <div className="grid gap-gutter sm:grid-cols-2 xl:grid-cols-3">
           {servers.isLoading
             ? Array(8)
-                .fill(null)
-                .map((_el, i) => <ServerCard key={i} />)
+              .fill(null)
+              .map((_el, i) => <ServerCard key={i} />)
             : servers.data
-                .sort((a, b) => {
-                  if (a.approval_required === b.approval_required) {
-                    return b.last_week_users - a.last_week_users
-                  } else if (a.approval_required) {
-                    return 1
-                  } else if (b.approval_required) {
-                    return -1
-                  } else {
-                    return b.last_week_users - a.last_week_users
-                  }
-                })
-                .map((server) => (
-                  <ServerCard key={server.domain} server={server} />
-                ))}
+              .sort((a, b) => {
+                if (a.approval_required === b.approval_required) {
+                  return b.last_week_users - a.last_week_users
+                } else if (a.approval_required) {
+                  return 1
+                } else if (b.approval_required) {
+                  return -1
+                } else {
+                  return b.last_week_users - a.last_week_users
+                }
+              })
+              .map((server) => (
+                <ServerCard key={server.domain} server={server} />
+              ))}
         </div>
       )}
     </div>
@@ -658,53 +658,53 @@ const ServerFilters = ({
       <ul className="grid grid-cols-[repeat(auto-fill,minmax(11rem,1fr))] gap-1 md:-ml-3 md:grid-cols-1 md:gap-x-3">
         {!initialCategories
           ? new Array(11).fill(null).map((_, i) => (
-              <li className="h-8 p-3" key={i}>
-                <SkeletonText className="!h-full" />
-              </li>
-            ))
+            <li className="h-8 p-3" key={i}>
+              <SkeletonText className="!h-full" />
+            </li>
+          ))
           : categories?.map((item, i) => {
-              const isActive = filters.category === item.category
-
-              return (
-                <li key={i}>
-                  <label
-                    className={classnames(
-                      "b2 flex cursor-pointer gap-1 rounded p-3 focus-visible-within:outline focus-visible-within:outline-2 focus-visible-within:outline-blurple-500",
-                      isActive && "bg-nightshade-50 !font-extrabold",
-                      item.servers_count === 0 && "text-gray-2"
-                    )}
-                  >
-                    <input
-                      className="sr-only"
-                      type="checkbox"
-                      name="filters-category"
-                      onChange={() => {
-                        setFilters({
-                          ...filters,
-                          category: isActive ? "" : item.category,
-                        })
-                      }}
-                    />
-                    {item.category === ""
-                      ? intl.formatMessage({
-                          id: "wizard.filter.all_categories",
-                          defaultMessage: "All topics",
-                        })
-                      : categoriesMessages[item.category]
+            const isActive = filters.category === item.category
+
+            return (
+              <li key={i}>
+                <label
+                  className={classnames(
+                    "b2 flex cursor-pointer gap-1 rounded p-3 focus-visible-within:outline focus-visible-within:outline-2 focus-visible-within:outline-blurple-500",
+                    isActive && "bg-nightshade-50 !font-extrabold",
+                    item.servers_count === 0 && "text-gray-2"
+                  )}
+                >
+                  <input
+                    className="sr-only"
+                    type="checkbox"
+                    name="filters-category"
+                    onChange={() => {
+                      setFilters({
+                        ...filters,
+                        category: isActive ? "" : item.category,
+                      })
+                    }}
+                  />
+                  {item.category === ""
+                    ? intl.formatMessage({
+                      id: "wizard.filter.all_categories",
+                      defaultMessage: "All topics",
+                    })
+                    : categoriesMessages[item.category]
                       ? intl.formatMessage(categoriesMessages[item.category])
                       : item.category}
 
-                    <span
-                      className={
-                        isActive ? "text-nightshade-100" : "text-gray-2"
-                      }
-                    >
-                      ({item.servers_count})
-                    </span>
-                  </label>
-                </li>
-              )
-            })}
+                  <span
+                    className={
+                      isActive ? "text-nightshade-100" : "text-gray-2"
+                    }
+                  >
+                    ({item.servers_count})
+                  </span>
+                </label>
+              </li>
+            )
+          })}
       </ul>
     </div>
   )