Change the layout style of market item list

[debuggy]

Main features:

1. Shrink the item card (including icon and info section) and also the layout of item card list view.
2. Split 3 sections in item list view: Official, Public and Private. Each section has a more button to expand.
3. Add categories filter in sidebar.
4. Refine the filter logic to support multiple filter rules and query in the meantime.

Before:

After:

filter:

[hippogr]

er, it is not your change, but I am just curious why we use Chinese character here? Only Chinese people can access this repo?

---

In reply to: 854270976

---

Refers to: webportal/src/app/assets/data.svg:5 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[yiyione]

sorry for the close ……

[qfyin]

I guess it's caused by OU Yang's authoring tool.

---

In reply to: 854270976

---

Refers to: webportal/src/app/assets/data.svg:5 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[qfyin]

alert(`Update item ${itemId} successed.`);

Successfully updated item XXXX.

---

Refers to: webportal/src/app/utils/marketplace_api.js:176 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[qfyin]

alert(`Delete item ${itemId} successed.`);

Successfully deleted item XXXX.

---

Refers to: webportal/src/app/utils/marketplace_api.js:195 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[qfyin]

alert(`Delete item ${itemId} successed.`);

BTW, for a succeeded action like this, I personally don't like to be interrupted by a message box.
A notifiation message like in VS Code or Azure Portal might be better.
I remember in OpenPAI portal there's similar stuff.

---

Refers to: webportal/src/app/utils/marketplace_api.js:195 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[debuggy]

er, it is not your change, but I am just curious why we use Chinese character here? Only Chinese people can access this repo?

Refers to: webportal/src/app/assets/data.svg:5 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

It is because this svg file is auto-generated by adobe xd, which is given from our designer

[hippogr]

you may change it in the future since this project is not for China only...

---

In reply to: 854321298

---

Refers to: webportal/src/app/assets/data.svg:5 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

[hippogr]

[debuggy]

you may change it in the future since this project is not for China only...

In reply to: 854321298

Refers to: webportal/src/app/assets/data.svg:5 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

Sure, although it will be a big project. I have discussed with designer if the output svg file could use English as default language, maybe I could double check with him.

[debuggy]

alert(`Delete item ${itemId} successed.`);

BTW, for a succeeded action like this, I personally don't like to be interrupted by a message box.
A notifiation message like in VS Code or Azure Portal might be better.
I remember in OpenPAI portal there's similar stuff.

Refers to: webportal/src/app/utils/marketplace_api.js:195 in 0f6ada0. [](commit_id = 0f6ada0, deletion_comment = False)

The alert message has been updated.

Maybe we could use a univeral message bar as a notification for successful action.

[hippogr]