Skip to content

Commit

Permalink
V 0.1.4 (#2)
Browse files Browse the repository at this point in the history
* Updated readme.md, package.json

* Added homepage to package.json
  • Loading branch information
giollord authored Jan 5, 2025
1 parent f26b599 commit 87da482
Show file tree
Hide file tree
Showing 2 changed files with 38 additions and 11 deletions.
39 changes: 30 additions & 9 deletions plugins/group-sort-strapi-plugin/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,28 @@

Plugin allows to group content by existing fields and order items within groups. It might be useful for making image galleries, organizing articles, or managing product listings.

There are two types of ordering supported - simple 1-dimensional drag-and-drop ordering, and arrangement based on react-grid-layout to allow placing and resizing items on 2d grid.
There are three types of arrangement supported:
- Simple 1-dimensional drag-and-drop arrangement
- Arrangement based on react-grid-layout to allow placing and resizing items on 2d grid
- Arrangement in separate rows that allow to have multiple rows with variable amount of items

# Installation

Execute the following `npm` command in command prompt:
```
npm install group-arrange-strapi-plugin
```
Or for yarn

```
yarn add group-arrange-strapi-plugin
```

# Description
This section explain how plugin works.
## Welcome page
First page that is open when clicking plugin button. It contains some instructions on how to use the plugin. When collection type is chosen in the left menu, it will open list of available groups under that collection type.
![Welcome page screenshot](./readmeAssets/welcome-page.png)
![Welcome page screenshot](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/welcome-page.png)

## Creating field
First need to create order field of one of three types:
Expand All @@ -21,43 +38,43 @@ Different field types have slightly different settings.
- Order 2d direction - default direction in which items will be "falling" to during editing
- Grouping field - select field that will be used for grouping for this column. So, if there is field `city` and we have field `order` that is configured to gooup by field `city`, and we have items `Item 1 (Paris)`, `Item 2 (Berlin)`, `Item 3 (Paris)`, `Item 4 (Paris)`, then item 1, 3 and 4 will have values of `order` field 0, 1 and 2, while item 2 will have `order` value 0.

![Creating field](./readmeAssets/create-content-type.gif)
![Creating field](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/create-content-type.gif)

## Group choice
This is second page of the plugin where user can select group to edit ordering within. List of groups is taken by looking at **all the items** within chosen collection type. Parentheses display field that is used to group by. When group is selected, user is navigated to the next page to edit the order.
![Group choice](./readmeAssets/choose-group.png)
![Group choice](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/choose-group.png)

## View configuration
Settings on the top are user-specific and are only saved in localSettings. These fields control how to display items - what field should be image, what should be title and subtitle. These fields are optional and cna be left or set to blank value.

![View configuration](./readmeAssets/view-configuration.gif)
![View configuration](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/view-configuration.gif)

## Simple drag-and-drop ordering
This view is used to order items by drag-and-drop.

> Do not forget to **Save** changes
![Drag-and-drop ordering](./readmeAssets/order-1d.gif)
![Drag-and-drop ordering](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/order-1d.gif)

## Two-dimensional arrangement
Allows to arrange items on 2d grid and to set size to items as well. Settings on the top are user-specific and are only saved in localSettings, except for `Direction` - this one is taken from content type field configuration every time user enters the page.

> Do not forget to **Save** changes
![Order 2d](./readmeAssets/order-2d.gif)
![Order 2d](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/order-2d.gif)

## Multiline arrangement
Allows to create new lines and drag-and drop items there. Lines can be reordered or deleted as well using respective buttons. If row is deleted, items return back to **Unsorted items**. On top panel it's possible to choose displayed columns count for unsorted items, as well as position (top/bottom) of unsorted items list.

> Do not forget to **Save** changes
![Multiline order](./readmeAssets/order-multiline.gif)
![Multiline order](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/order-multiline.gif)

## Global settings
There is currently just one global setting implemented:
- Always show type in list (True/False) - controls display of parentheses with field name in left menu in main plugin window. If enabled, parentheses will always will be displayed. If disabled, parentheses will be only displayed when there are multiple groups related to different fields with same name.

![Settings screenshot](./readmeAssets/global-settings.png)
![Settings screenshot](https://raw.githubusercontent.com/giollord/group-sort-strapi-plugin/develop/plugins/group-sort-strapi-plugin/readmeAssets/global-settings.png)

## API response
Here is an example of response for `GET http://localhost:1337/api/addresses/jqnaatceu6xdub1dnexdzk43`. Field `categoryOrder` is order 1d, `location` is order 2d and `orderMultiline` is multiline order field.
Expand Down Expand Up @@ -89,5 +106,9 @@ Here is an example of response for `GET http://localhost:1337/api/addresses/jqna
}
```

# TODOs
- [x] Installable version of plugin
- [ ] Batch items update instead of sending API request per item in group

# Contribution
Please feel free to send your PRs if you'd like to fix/add/improve something!
10 changes: 8 additions & 2 deletions plugins/group-sort-strapi-plugin/package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"version": "0.1.0",
"version": "0.1.4",
"keywords": [],
"type": "commonjs",
"exports": {
Expand Down Expand Up @@ -75,5 +75,11 @@
"name": "group-arrange-strapi-plugin",
"description": "Allows to group and arrange content",
"license": "MIT",
"author": "Barkov Daniil <giollord@gmail.com>"
"author": "Barkov Daniil <giollord@gmail.com>",
"repository": {
"type": "git",
"url": "git+https://github.com/giollord/group-sort-strapi-plugin.git",
"directory": "plugins/group-sort-strapi-plugin"
},
"homepage": "https://github.com/giollord/group-sort-strapi-plugin/tree/develop/plugins/group-sort-strapi-plugin"
}

0 comments on commit 87da482

Please sign in to comment.