import { Row, Column, Card, CardBody, List, ListItem, } from "@nimles/react-web-components";
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
import { searchAndLoadPublicPosts, useAppDispatch } from "@nimles/react-redux";
import styled from "@emotion/styled";
import { NavLink } from "./Link";
const Name = styled.h2 `
  font-size: 16px;
  margin-top: 0;
  font-size: 500;
  flex: 1 0 auto;
`;
const CardLink = styled(NavLink) `
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
`;
export const PostList = ({ organizationId, start, limit, order, style }) => {
    const dispatch = useAppDispatch();
    const posts = useSelector(({ publicPosts }) => publicPosts.values);
    useEffect(() => {
        dispatch(searchAndLoadPublicPosts({ start, limit, order, organizationId }));
    }, [start, limit, order, organizationId]);
    style = style && style.toLowerCase();
    switch (style) {
        case "cards":
            return (<Row wrap>
          {posts.map((post) => (<Column key={post.id} padding xs={100}>
              <Card flex="1 0 auto">
                <CardLink to={`/${post.uniqueName}/pt`}>
                  <CardBody>
                    <Name>{post.title}</Name>
                  </CardBody>
                </CardLink>
              </Card>
            </Column>))}
        </Row>);
        case "list":
            return (<List>
          {posts.map((post) => (<ListItem key={post.id}>
              <NavLink to={`/${post.uniqueName}/pt`}>{post.title}</NavLink>
            </ListItem>))}
        </List>);
        case "menu":
            return (<List>
          {posts.map((post) => (<ListItem key={post.id} inheritColors>
              <NavLink to={`/${post.uniqueName}/pt`}>{post.title}</NavLink>
            </ListItem>))}
        </List>);
        default:
            return (<List>
          {posts.map((post) => (<ListItem key={post.id}>
              <NavLink to={`/${post.uniqueName}/pt`}>{post.title}</NavLink>
            </ListItem>))}
        </List>);
    }
};
//# sourceMappingURL=PostList.jsx.map