Switch repo overview layout to cards

Squash commits of branch feature/repo_overview_cards:

- Switch repo overview layout to cards

- wip

- Merge branch 'develop' into feature/repo_overview_cards

- Fix collapsible

- Fix collapsible

- Fix styling

- Merge branch 'develop' into feature/repo_overview_cards

- Fix type for collapsible

- Add changelog

- Update storyshots

- Merge branch 'develop' into feature/repo_overview_cards



Committed-by: Thomas Zerr <thomas.zerr@cloudogu.com>
Co-authored-by: tzerr <thomas.zerr@cloudogu.com>
This commit is contained in:
Eduard Heimbuch
2023-08-28 13:53:36 +02:00
parent de813efcb1
commit cd59873638
19 changed files with 1124 additions and 1574 deletions

View File

@@ -22,35 +22,18 @@
* SOFTWARE.
*/
import React, { FC } from "react";
import { Link } from "react-router-dom";
import { Icon, RepositoryEntry, GroupEntries } from "@scm-manager/ui-components";
import { NamespaceEntries, RepositoryEntry } from "@scm-manager/ui-components";
import { RepositoryGroup } from "@scm-manager/ui-types";
import { useTranslation } from "react-i18next";
type Props = {
group: RepositoryGroup;
};
const RepositoryGroupEntry: FC<Props> = ({ group }) => {
const [t] = useTranslation("namespaces");
const settingsLink = group.namespace?._links?.permissions && (
<Link to={`/namespace/${group.name}/settings`} aria-label={t("repositoryOverview.settings.tooltip")}>
<Icon color="inherit" name="cog" title={t("repositoryOverview.settings.tooltip")} className="is-size-6 ml-2" />
</Link>
);
const namespaceHeader = (
<>
<Link to={`/repos/${group.name}/`} className="has-text-inherit">
{group.name}
</Link>{" "}
{settingsLink}
</>
);
const entries = group.repositories.map((repository, index) => {
return <RepositoryEntry repository={repository} key={index} />;
const entries = group.repositories.map((repository) => {
return <RepositoryEntry repository={repository} key={repository.name} />;
});
return <GroupEntries namespaceHeader={namespaceHeader} elements={entries} />;
return <NamespaceEntries group={group} elements={entries} />;
};
export default RepositoryGroupEntry;

View File

@@ -21,7 +21,7 @@
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
import React from "react";
import React, { FC } from "react";
import { NamespaceCollection, Repository } from "@scm-manager/ui-types";
@@ -33,19 +33,12 @@ type Props = {
namespaces: NamespaceCollection;
};
class RepositoryList extends React.Component<Props> {
render() {
const { repositories, namespaces } = this.props;
const groups = groupByNamespace(repositories, namespaces);
return (
<div className="content">
{groups.map((group) => {
return <RepositoryGroupEntry group={group} key={group.name} />;
})}
</div>
);
}
}
const RepositoryList: FC<Props> = ({ repositories, namespaces }) => (
<>
{groupByNamespace(repositories, namespaces).map((group) => (
<RepositoryGroupEntry group={group} key={group.name} />
))}
</>
);
export default RepositoryList;