Fix extraneous arrow showing on home page if Meta 2 is empty string

Author: yutotakano

frontend/src/pages/home-page.tsx

@@ -368,49 +368,61 @@ export const CategoryList: React.FC<{}> = () => {
                         </Group>
                       }
                       contentInsideCollapse={meta2.map(
-                        ([meta2display, categories]) => (
-                          <div
-                            key={meta2display}
-                            id={slugify(meta1display + meta2display)}
-                          >
-                            <CollapseWrapper
-                              title={
-                                <Title order={3} my="sm">
-                                  {meta2display}
-                                </Title>
-                              }
-                              contentOutsideCollapse={
-                                <Group>
-                                  {isAdmin && (
-                                    <EditMeta2
-                                      oldMeta2={meta2display}
-                                      meta1={meta1display}
-                                      onChange={onChange}
-                                    />
-                                  )}
-                                </Group>
-                              }
-                              contentInsideCollapse={
-                                <Grid>
-                                  {categories.map(category => (
-                                    <CategoryCard
-                                      category={category}
-                                      key={category.slug}
-                                      className={fadeClasses.fadeInOrder}
-                                      onFavouriteToggle={onFavouriteToggle}
-                                    />
-                                  ))}
-                                </Grid>
-                              }
-                              is_collapsed={() =>
-                                is_collapsed(meta1display + meta2display)
-                              }
-                              collapse_expand={() =>
-                                collapse_expand(meta1display + meta2display)
-                              }
-                            />
-                          </div>
-                        ),
+                        ([meta2display, categories]) =>
+                          meta2display === "" ? (
+                            <Grid key={meta2display}>
+                              {categories.map(category => (
+                                <CategoryCard
+                                  category={category}
+                                  key={category.slug}
+                                  className={fadeClasses.fadeInOrder}
+                                  onFavouriteToggle={onFavouriteToggle}
+                                />
+                              ))}
+                            </Grid>
+                          ) : (
+                            <div
+                              key={meta2display}
+                              id={slugify(meta1display + meta2display)}
+                            >
+                              <CollapseWrapper
+                                title={
+                                  <Title order={3} my="sm">
+                                    {meta2display}
+                                  </Title>
+                                }
+                                contentOutsideCollapse={
+                                  <Group>
+                                    {isAdmin && (
+                                      <EditMeta2
+                                        oldMeta2={meta2display}
+                                        meta1={meta1display}
+                                        onChange={onChange}
+                                      />
+                                    )}
+                                  </Group>
+                                }
+                                contentInsideCollapse={
+                                  <Grid>
+                                    {categories.map(category => (
+                                      <CategoryCard
+                                        category={category}
+                                        key={category.slug}
+                                        className={fadeClasses.fadeInOrder}
+                                        onFavouriteToggle={onFavouriteToggle}
+                                      />
+                                    ))}
+                                  </Grid>
+                                }
+                                is_collapsed={() =>
+                                  is_collapsed(meta1display + meta2display)
+                                }
+                                collapse_expand={() =>
+                                  collapse_expand(meta1display + meta2display)
+                                }
+                              />
+                            </div>
+                          ),
                       )}
                       is_collapsed={() => is_collapsed(meta1display)}
                       collapse_expand={() => collapse_expand(meta1display)}