Skip to content

Commit

Permalink
feat: support group in widget item (#118)
Browse files Browse the repository at this point in the history 
* feat: support group in widget item

* chore: add tests

* fix: review issues
  • Loading branch information
@mournfulCoroner
mournfulCoroner committed Mar 7, 2024
1 parent 0af065f commit 801de4c
Show file tree
Hide file tree
Showing 10 changed files with 965 additions and 188 deletions.
4 changes: 3 additions & 1 deletion src/components/ActionPanel/ActionPanel.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,9 @@
flex-direction: column;
justify-content: center;
align-items: center;
transition: 300ms color ease-in-out, 300ms background-color ease-in-out;
transition:
300ms color ease-in-out,
300ms background-color ease-in-out;
border-radius: 6px;
padding: 0 12px;
box-sizing: border-box;
Expand Down
257 changes: 254 additions & 3 deletions src/shared/modules/__tests__/helpers.test.ts
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,25 @@
import {ConfigItem, StringParams, ItemsStateAndParams, ConfigItemData} from '../../types';
import {
Config,
ConfigItem,
ConfigItemData,
ConfigItemWithGroup,
ItemsStateAndParams,
StringParams,
} from '../../types';
import {ACTION_PARAM_PREFIX, META_KEY} from '../../constants';
import {
addGroupToQueue,
addToQueue,
formQueueData,
hasActionParams,
pickExceptActionParamsFromParams,
transformParamsToActionParams,
} from '../helpers';

const DEFAULT_CONTROL_ID = 'controlId';
const DEFAULT_CONTROL_ID_2 = 'controlId2';
const DEFAULT_GROUP_ITEM_ID = 'groupItemId';
const DEFAULT_GROUP_ITEM_ID_2 = 'groupItemId2';
const DEFAULT_WIDGET_ID = 'widgetId';
const DEFAULT_WIDGET_TAB_ID = 'widget_tabId';
const NAMESPACE = 'default';
Expand All @@ -17,6 +29,11 @@ type MockedControlItemArgs = {
id?: string;
};

type MockedGroupControlItemArgs = MockedControlItemArgs & {
groupItemId?: string;
groupItemId2?: string;
};

const getMockedControlItem = ({
id = DEFAULT_CONTROL_ID,
defaults,
Expand All @@ -28,11 +45,37 @@ const getMockedControlItem = ({
namespace: NAMESPACE,
});

const getMockedGroupControlItem = ({
id = DEFAULT_CONTROL_ID,
groupItemId = DEFAULT_GROUP_ITEM_ID,
groupItemId2 = DEFAULT_GROUP_ITEM_ID_2,
defaults,
}: MockedGroupControlItemArgs): ConfigItemWithGroup => ({
id,
data: {
group: [
{id: groupItemId, namespace: NAMESPACE, defaults},
{id: groupItemId2, namespace: NAMESPACE, defaults},
],
},
type: 'group-control',
namespace: NAMESPACE,
});

type MockedWidgetItemArgs = {
id?: string;
tabs?: ConfigItemData['tabs'];
};

const getMockedConfig = ({items}: {items: ConfigItem[]}): Config => ({
items,
salt: '0.9021043992843898',
counter: 124,
layout: [],
aliases: {},
connections: [],
});

const stateAndParamsWithParamsOnly = {
params: {
paramName: 'param1',
Expand Down Expand Up @@ -155,6 +198,63 @@ describe('modules.helpers', () => {
]).toEqual(formQueueData({items: [controlItem5], itemsStateAndParams}));
});

it('return correct queue data for control: group control', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[DEFAULT_CONTROL_ID]: {
params: {
[DEFAULT_GROUP_ITEM_ID]: {
scale: 'd',
view: 'normal',
},
},
},
[META_KEY]: {
queue: [{id: DEFAULT_CONTROL_ID, groupItemId: DEFAULT_GROUP_ITEM_ID}],
version: 2,
},
};

const controlItem1 = getMockedGroupControlItem({
id: 'control-1',
groupItemId: 'group-control-1',
});
expect([]).toEqual(formQueueData({items: [controlItem1], itemsStateAndParams}));

const controlItem2 = getMockedGroupControlItem({defaults: {number: 'one', size: 's'}});
expect([
{
id: DEFAULT_GROUP_ITEM_ID,
namespace: NAMESPACE,
params: {},
},
]).toEqual(formQueueData({items: [controlItem2], itemsStateAndParams}));

const controlItem4 = getMockedGroupControlItem({defaults: {scale: 'm', size: 's'}});
expect([
{
id: DEFAULT_GROUP_ITEM_ID,
namespace: NAMESPACE,
params: {
scale: 'd',
},
},
]).toEqual(formQueueData({items: [controlItem4], itemsStateAndParams}));

const controlItem5 = getMockedGroupControlItem({
defaults: {scale: 'm', size: 's', view: 'contrast'},
});
expect([
{
id: DEFAULT_GROUP_ITEM_ID,
namespace: NAMESPACE,
params: {
scale: 'd',
view: 'normal',
},
},
]).toEqual(formQueueData({items: [controlItem5], itemsStateAndParams}));
});

it('return correct queue data for widget: common', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[DEFAULT_WIDGET_ID]: {
Expand Down Expand Up @@ -282,10 +382,18 @@ describe('modules.helpers', () => {
view: 'normal',
},
},
[DEFAULT_CONTROL_ID_2]: {
params: {
[DEFAULT_GROUP_ITEM_ID]: {
size: 'm',
},
},
},
[META_KEY]: {
queue: [
{id: DEFAULT_CONTROL_ID},
{id: DEFAULT_WIDGET_ID, tabId: DEFAULT_WIDGET_TAB_ID},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
],
version: 2,
},
Expand All @@ -301,20 +409,42 @@ describe('modules.helpers', () => {
});
const control1 = getMockedControlItem({id: 'control-1'});
const control2 = getMockedControlItem({defaults: {scale: 'm', view: 'contrast'}});
const groupControl1 = getMockedGroupControlItem({id: 'group-control-1'});
const groupControl2 = getMockedGroupControlItem({
id: DEFAULT_CONTROL_ID_2,
defaults: {size: 'xl', view: 'normal'},
});
expect([
{
id: DEFAULT_CONTROL_ID,
namespace: NAMESPACE,
params: {scale: 'd'},
params: {
scale: 'd',
},
},
{
id: DEFAULT_WIDGET_ID,
namespace: NAMESPACE,
params: {view: 'normal'},
},
{
id: DEFAULT_GROUP_ITEM_ID,
namespace: NAMESPACE,
params: {
size: 'm',
},
},
]).toEqual(
formQueueData({
items: [widgetItem2, widgetItem3, control1, widgetItem1, control2],
items: [
widgetItem2,
widgetItem3,
control1,
widgetItem1,
control2,
groupControl1,
groupControl2,
],
itemsStateAndParams,
}),
);
Expand Down Expand Up @@ -364,4 +494,125 @@ describe('modules.helpers', () => {
);
});
});

describe('queue helpers', () => {
it('add common control to the end of queue', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[META_KEY]: {
queue: [
{id: DEFAULT_CONTROL_ID},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
],
version: 2,
},
};

const config = getMockedConfig({
items: [
getMockedControlItem({}),
getMockedGroupControlItem({id: DEFAULT_CONTROL_ID_2}),
],
});

expect({
queue: [
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
{id: DEFAULT_CONTROL_ID},
],
version: 2,
}).toEqual(addToQueue({id: DEFAULT_CONTROL_ID, config, itemsStateAndParams}));
});

it('remove unused items from queue after adding new group item: remove common items and group items', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[META_KEY]: {
queue: [
{id: 'control1'},
{id: 'control2', tabId: 'tab'},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID_2},
{id: DEFAULT_CONTROL_ID},
{id: DEFAULT_CONTROL_ID_2, groupItemId: 'group-item-1'},
],
version: 2,
},
};

const config = getMockedConfig({
items: [
getMockedControlItem({}),
getMockedGroupControlItem({id: DEFAULT_CONTROL_ID_2}),
],
});
expect({
queue: [
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID_2},
{id: DEFAULT_CONTROL_ID},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
],
version: 2,
}).toEqual(
addGroupToQueue({
id: DEFAULT_CONTROL_ID_2,
groupItemIds: [DEFAULT_GROUP_ITEM_ID],
config,
itemsStateAndParams,
}),
);
});

it('remove unused items from queue after adding new item: remove common items and item with group', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[META_KEY]: {
queue: [
{id: 'control1'},
{id: 'control2', tabId: 'a3'},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID_2},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
],
version: 2,
},
};

const config = getMockedConfig({
items: [getMockedControlItem({})],
});
expect({
queue: [{id: DEFAULT_CONTROL_ID}],
version: 2,
}).toEqual(
addToQueue({
id: DEFAULT_CONTROL_ID,
config,
itemsStateAndParams,
}),
);
});

it('add group control to queue', () => {
const itemsStateAndParams: ItemsStateAndParams = {
[META_KEY]: {
queue: [{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID_2}],
version: 2,
},
};

const config = getMockedConfig({
items: [getMockedGroupControlItem({})],
});
expect({
queue: [
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID},
{id: DEFAULT_CONTROL_ID_2, groupItemId: DEFAULT_GROUP_ITEM_ID_2},
],
version: 2,
}).toEqual(
addGroupToQueue({
id: DEFAULT_CONTROL_ID_2,
groupItemIds: [DEFAULT_GROUP_ITEM_ID, DEFAULT_GROUP_ITEM_ID_2],
config,
itemsStateAndParams,
}),
);
});
});
});
Loading

0 comments on commit 801de4c

Please sign in to comment.