@farm-investimentos/front-mfe-components 2.3.0 → 2.4.3

package/src/components/DataTableHeader/__tests__/DataTableHeader.spec.js

@@ -0,0 +1,89 @@
+import { shallowMount } from '@vue/test-utils';
+import DataTableHeader from '../DataTableHeader';
+
+describe('DataTableHeader component', () => {
+	let wrapper;
+	let component;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DataTableHeader, {
+			propsData: {
+				headers: [
+					{
+						value: 'A',
+					},
+				],
+				sortClick: [
+					{
+						clicked: true,
+						show: true,
+					},
+					{
+						clicked: false,
+						show: false,
+					},
+				],
+				selectedIndex: 0,
+				firstSelected: true,
+			},
+		});
+		component = wrapper.vm;
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+
+	describe('Methods', () => {
+		it('Should check if item is data-table-select column', () => {
+			expect(component.isTHDataTableSelect({ value: 'data-table-select' })).toBeTruthy();
+			expect(component.isTHDataTableSelect({ value: 'anything else' })).toBeFalsy();
+		});
+
+		it('Should get th width', () => {
+			expect(component.thWidth({ value: 'data-table-select' })).toEqual('64px');
+			expect(component.thWidth({ width: 24 })).toEqual('24px');
+			expect(component.thWidth({})).toEqual('auto');
+		});
+
+		it('Should remove clicked', () => {
+			component.removeClicked();
+			expect(component.sortClick[0].clicked).toBeFalsy();
+			expect(component.sortClick[0].show).toBeFalsy();
+		});
+
+		it('Should check first selected', () => {
+			expect(component.checkFirstSelected(999)).toBeFalsy();
+			expect(component.checkFirstSelected(0)).toBeTruthy();
+		});
+
+		it('Should emit event when clickSort', () => {
+			component.clickSort('A', 0);
+			expect(wrapper.emitted().onClickSort).toBeDefined();
+		});
+
+		it('Should get type sort', () => {
+			expect(component.getTypeSort(false)).toEqual('ASC');
+			expect(component.getTypeSort(true)).toEqual('DESC');
+		});
+
+		it('Should change show', async () => {
+			component.changeShow(0);
+			await new Promise(r => setTimeout(r, 20));
+			expect(component.sortClick[0].show).toBeTruthy();
+		});
+
+		it('Should change show', async () => {
+			component.changeHidden(0);
+			component.changeHidden(1);
+			await new Promise(r => setTimeout(r, 30));
+			expect(component.sortClick[1].show).toBeFalsy();
+		});
+	});
+});

package/src/components/DataTablePaginator/__tests__/DataTablePaginator.spec.js

@@ -0,0 +1,20 @@
+import { shallowMount } from '@vue/test-utils';
+import DataTablePaginator from '../DataTablePaginator';
+
+describe('DataTablePaginator component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DataTablePaginator);
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/DatePicker/__tests__/DatePicker.spec.js

@@ -0,0 +1,24 @@
+import { shallowMount } from '@vue/test-utils';
+import DatePicker from '../DatePicker';
+
+describe('DatePicker component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DatePicker, {
+			propsData: {
+				inputId: 'someid',
+			},
+		});
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/DefaultTextField/__tests__/DefaultTextField.spec.js

@@ -0,0 +1,25 @@
+import { shallowMount } from '@vue/test-utils';
+import DefaultTextField from '../DefaultTextField';
+
+describe('DefaultTextField component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DefaultTextField, {
+			propsData: {
+				item: {},
+				value: false,
+			},
+		});
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/DialogFooter/__tests__/DialogFooter.spec.js

@@ -0,0 +1,20 @@
+import { shallowMount } from '@vue/test-utils';
+import DialogFooter from '../DialogFooter';
+
+describe('DialogFooter component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DialogFooter);
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/DialogHeader/__tests__/DialogHeader.spec.js

@@ -0,0 +1,24 @@
+import { shallowMount } from '@vue/test-utils';
+import DialogHeader from '../DialogHeader';
+
+describe('DialogHeader component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(DialogHeader, {
+			propsData: {
+				title: ''
+			}
+		});
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/IconBox/IconBox.scss

@@ -0,0 +1,14 @@
+.icon-box {
+	width: 40px;
+	height: 40px;
+	padding: 6px;
+	background: linear-gradient(0deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), #00b493;
+	border-radius: 5px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.icon i {
+	font-size: 1.875em;
+}

package/src/components/IconBox/IconBox.stories.js

@@ -0,0 +1,13 @@
+import IconBox from './IconBox.vue';
+
+export default {
+	title: 'Example/IconBox',
+	component: IconBox,
+};
+
+export const Primary = () => ({
+	components: { IconBox },
+	template: '<IconBox icon="mdi-currency-usd" />',
+});
+
+Primary.storyName = 'Básico';

package/src/components/IconBox/IconBox.vue

@@ -0,0 +1,29 @@
+<template>
+	<div class="icon-box">
+		<div class="icon">
+			<v-icon color="secondary">{{ icon }}</v-icon>
+		</div>
+	</div>
+</template>
+
+<script>
+import Vue from 'vue';
+import VIcon from 'vuetify/lib/components/VIcon';
+
+export default Vue.extend({
+	name: 'farm-icon-box',
+	components: {
+		VIcon,
+	},
+	props: {
+		icon: {
+			type: String,
+			require: true,
+		},
+	},
+});
+</script>
+
+<style lang="sass" scoped>
+@import './IconBox.scss'
+</style>

package/src/components/IconBox/__tests__/IconBox.spec.js

@@ -0,0 +1,20 @@
+import { shallowMount } from '@vue/test-utils';
+import IconBox from '../IconBox';
+
+describe('IconBox component', () => {
+	let wrapper;
+
+	beforeEach(() => {
+		wrapper = shallowMount(IconBox);
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('mount component', () => {
+		it('renders correctly', () => {
+			expect(wrapper.element).toMatchSnapshot();
+		});
+	});
+});

package/src/components/IconBox/index.js

@@ -0,0 +1,3 @@
+import IconBox from './IconBox.vue';
+
+export default IconBox;

package/src/components/MainFilter/__tests__/MainFilter.spec.js

@@ -0,0 +1,23 @@
+import { shallowMount } from '@vue/test-utils';
+import MainFilter from '../MainFilter';
+
+describe('MainFilter component', () => {
+	let wrapper;
+	let component;
+
+	beforeEach(() => {
+		wrapper = shallowMount(MainFilter);
+		component = wrapper.vm;
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('methods', () => {
+		it('Should emit event', () => {
+			component.onFilterClick();
+			expect(wrapper.emitted().onClick).toBeTruthy();
+		});
+	});
+});

package/src/components/ManagersList/__tests__/ManagersList.spec.js

@@ -0,0 +1,27 @@
+import { shallowMount } from '@vue/test-utils';
+import ManagersList from '../ManagersList';
+
+describe('ManagersList component', () => {
+	let wrapper;
+	let component;
+
+	beforeEach(() => {
+		wrapper = shallowMount(ManagersList, {
+			propsData: {
+				managersString: 'a,b,c',
+			},
+		});
+		component = wrapper.vm;
+	});
+
+	test('Created hook', () => {
+		expect(wrapper).toBeDefined();
+	});
+
+	describe('Computed properties', () => {
+		it('Should have managers array', () => {
+			expect(component.managers).toBeInstanceOf(Array);
+			expect(component.managers.length).toEqual(3);
+		});
+	});
+});

package/src/components/Tabs/{Tabs.spec.js → __tests__/Tabs.spec.js}

@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import Tabs from './Tabs';
+import Tabs from '../Tabs';
 
 describe('Tabs component', () => {
     let wrapper;

package/src/main.js

@@ -16,6 +16,9 @@ import PromptUserToConfirm from './components/PromptUserToConfirm';
 import ModalPromptUser from './components/ModalPromptUser';
 
 import TableContextMenu from './components/TableContextMenu';
+import IconBox from './components/IconBox';
+import CardContext from './components/CardContext';
+
 import DefaultButton from './components/Buttons/DefaultButton/DefaultButton';
 
 export {
@@ -37,6 +40,8 @@ export {
 	TableContextMenu,
 	ModalPromptUser,
 	DefaultButton,
+	IconBox,
+	CardContext,
 };
 
 export * from './components/Buttons/DefaultButton/';

package/src/components/MainFilter/MainFilter.spec.js

@@ -1,43 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import MainFilter from './MainFilter';
-
-describe('MainFilter component', () => {
-    let wrapper;
-    let component;
-
-    beforeEach(() => {
-        wrapper = shallowMount(MainFilter);
-        component = wrapper.vm;
-    });
-
-    test('Created hook', () => {
-        expect(wrapper).toBeDefined();
-    });
-
-    describe('methods', () => {
-        describe('onKeyUp', () => {
-            it('Should change value after throttle', done => {
-                const mockEvent = { target: { value: 'some value' } };
-                const spy = jest.spyOn(component, '$emit');
-                component.onKeyUp(mockEvent);
-                setTimeout(() => {
-                    expect(spy).toHaveBeenCalledWith('onInputChange', 'some value');
-                    done();
-                }, 300);
-            });
-
-            it('Should clear timer', async () => {
-                await wrapper.setData({ timer: true });
-                const mockEvent = { target: { value: 'some value' } };
-                const spy = jest.spyOn(window, 'clearTimeout');
-                component.onKeyUp(mockEvent);
-                expect(spy).toHaveBeenCalled();
-            });
-        });
-
-        it('Should emit event', () => {
-            component.onFilterClick();
-            expect(wrapper.emitted().onClick).toBeTruthy();
-        });
-    });
-});