Order organization by name

Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>
This commit is contained in:
Sacha Al Himdani
2025-09-11 18:30:01 +02:00
parent c73bb08f25
commit d0e3c63a05
10 changed files with 837 additions and 246 deletions

View File

@@ -9,18 +9,13 @@ import {
Button,
Card,
IconPlusLarge,
ActionDropdown,
DropdownItem,
IconTrashCan,
} from "@probo/ui";
import { usePageTitle } from "@probo/hooks";
import { useDeleteOrganizationMutation } from "../hooks/graph/OrganizationGraph";
import { DeleteOrganizationDialog } from "../components/organizations/DeleteOrganizationDialog";
const OrganizationsPageQuery = graphql`
query OrganizationsPageQuery {
viewer {
organizations(first: 25) @connection(key: "OrganizationsPage_organizations") {
organizations(first: 1000, orderBy: {field: NAME, direction: ASC}) @connection(key: "OrganizationsPage_organizations") {
__id
edges {
node {
@@ -67,7 +62,6 @@ export default function OrganizationsPage() {
<OrganizationCard
key={organization.id}
organization={organization}
connectionId={data.viewer.organizations.__id}
/>
))}
<Card padded>
@@ -98,23 +92,10 @@ type OrganizationCardProps = {
name: string;
logoUrl: string | null | undefined;
};
connectionId: string;
};
function OrganizationCard({ organization, connectionId }: OrganizationCardProps) {
function OrganizationCard({ organization }: OrganizationCardProps) {
const { __ } = useTranslate();
const [deleteOrganization, isDeleting] = useDeleteOrganizationMutation();
const handleDelete = () => {
return deleteOrganization({
variables: {
input: {
organizationId: organization.id,
},
connections: [connectionId],
},
});
};
return (
<Card padded className="w-full">
@@ -136,21 +117,6 @@ function OrganizationCard({ organization, connectionId }: OrganizationCardProps)
{__("Select")}
</Link>
</Button>
<DeleteOrganizationDialog
organizationName={organization.name}
onConfirm={handleDelete}
isDeleting={isDeleting}
>
<ActionDropdown>
<DropdownItem
variant="danger"
icon={IconTrashCan}
disabled={isDeleting}
>
{__("Delete organization")}
</DropdownItem>
</ActionDropdown>
</DeleteOrganizationDialog>
</div>
</div>
</Card>

View File

@@ -1,5 +1,5 @@
/**
* @generated SignedSource<<70d28036f17c3b03dcfecce6abd5b476>>
* @generated SignedSource<<84d0e43eced78862d1c82603e9c332e8>>
* @lightSyntaxTransform
* @nogrep
*/
@@ -31,13 +31,21 @@ export type OrganizationsPageQuery = {
const node: ConcreteRequest = (function(){
var v0 = {
"kind": "Literal",
"name": "orderBy",
"value": {
"direction": "ASC",
"field": "NAME"
}
},
v1 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v1 = [
v2 = [
{
"alias": null,
"args": null,
@@ -54,7 +62,7 @@ v1 = [
"name": "node",
"plural": false,
"selections": [
(v0/*: any*/),
(v1/*: any*/),
{
"alias": null,
"args": null,
@@ -127,12 +135,13 @@ v1 = [
]
}
],
v2 = [
v3 = [
{
"kind": "Literal",
"name": "first",
"value": 25
}
"value": 1000
},
(v0/*: any*/)
];
return {
"fragment": {
@@ -151,13 +160,15 @@ return {
"selections": [
{
"alias": "organizations",
"args": null,
"args": [
(v0/*: any*/)
],
"concreteType": "OrganizationConnection",
"kind": "LinkedField",
"name": "__OrganizationsPage_organizations_connection",
"plural": false,
"selections": (v1/*: any*/),
"storageKey": null
"selections": (v2/*: any*/),
"storageKey": "__OrganizationsPage_organizations_connection(orderBy:{\"direction\":\"ASC\",\"field\":\"NAME\"})"
}
],
"storageKey": null
@@ -182,31 +193,33 @@ return {
"selections": [
{
"alias": null,
"args": (v2/*: any*/),
"args": (v3/*: any*/),
"concreteType": "OrganizationConnection",
"kind": "LinkedField",
"name": "organizations",
"plural": false,
"selections": (v1/*: any*/),
"storageKey": "organizations(first:25)"
"selections": (v2/*: any*/),
"storageKey": "organizations(first:1000,orderBy:{\"direction\":\"ASC\",\"field\":\"NAME\"})"
},
{
"alias": null,
"args": (v2/*: any*/),
"filters": null,
"args": (v3/*: any*/),
"filters": [
"orderBy"
],
"handle": "connection",
"key": "OrganizationsPage_organizations",
"kind": "LinkedHandle",
"name": "organizations"
},
(v0/*: any*/)
(v1/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "ddaafef96749a932a0cee5286a3c2bbd",
"cacheID": "1735764e6816660969c5f96922320ac5",
"id": null,
"metadata": {
"connection": [
@@ -223,11 +236,11 @@ return {
},
"name": "OrganizationsPageQuery",
"operationKind": "query",
"text": "query OrganizationsPageQuery {\n viewer {\n organizations(first: 25) {\n edges {\n node {\n id\n name\n logoUrl\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n }\n }\n id\n }\n}\n"
"text": "query OrganizationsPageQuery {\n viewer {\n organizations(first: 1000, orderBy: {field: NAME, direction: ASC}) {\n edges {\n node {\n id\n name\n logoUrl\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n }\n }\n id\n }\n}\n"
}
};
})();
(node as any).hash = "122ab4331082ffe892fa7fe48692d961";
(node as any).hash = "6fde39384e4678f88f17c34bbd30e684";
export default node;

View File

@@ -57,7 +57,11 @@ export default function NewOrganizationPage() {
connections: [
ConnectionHandler.getConnectionID(
data.viewer.id,
"NewOrganizationPageQuery"
"OrganizationsPage_organizations"
),
ConnectionHandler.getConnectionID(
data.viewer.id,
"MainLayout_OrganizationSelector_organizations"
),
],
},