Skip to content

Commit

Permalink
feat: add Resizable item setting (#514)
Browse files Browse the repository at this point in the history
fix: filtering option in app auto-complete
chore: apply prettier to ts files
test: adapt tests to item settings refactor and types
  • Loading branch information
spaenleh authored Jan 12, 2023
1 parent 2359114 commit 80795c9
Show file tree
Hide file tree
Showing 34 changed files with 1,443 additions and 1,149 deletions.
7 changes: 6 additions & 1 deletion .eslintignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,9 @@ build
public
coverage
src/serviceWorker.js
cypress/integration/examples
cypress/integration/examples
node_modules
.yarn/.cache
.husky
.nyc_output
.yarn
30 changes: 17 additions & 13 deletions .eslintrc
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
{
"extends": [
"react-app",
"airbnb",
"react-app",
"airbnb",
"prettier",
"eslint:recommended",
"plugin:react/recommended",
"plugin:@typescript-eslint/recommended"],
"plugin:@typescript-eslint/recommended"
],
"plugins": ["import", "jsx-a11y", "react", "@typescript-eslint"],
"env": {
"browser": true,
Expand Down Expand Up @@ -56,17 +57,20 @@
"react/react-in-jsx-scope": "off",
"no-console": [1, { "allow": ["error"] }],
"import/extensions": [
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
],
"react/prop-types": "off",
"react/require-default-props": "off"
"react/require-default-props": "off",
// eslint rule reports false error
"no-shadow": "off",
"@typescript-eslint/no-shadow": ["error"]
},
"overrides": [
{
Expand Down Expand Up @@ -98,5 +102,5 @@
}
}
},
// "ignorePatterns": ["cypress/*"]
"ignorePatterns": ["node_modules/*"]
}
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,9 @@ cypress/videos
# jetbrains
.idea

# vscode
.vscode

# yarn
.yarn/*
!.yarn/patches
Expand Down
6 changes: 3 additions & 3 deletions cypress/support/commands/item.js
Original file line number Diff line number Diff line change
Expand Up @@ -171,9 +171,9 @@ Cypress.Commands.add('dragAndDrop', (subject, x, y) => {
cy.get(subject)
.first()
// eslint-disable-next-line no-shadow
.then((subject) => {
const coordsDrag = subject[0].getBoundingClientRect();
cy.wrap(subject)
.then((target) => {
const coordsDrag = target[0].getBoundingClientRect();
cy.wrap(target)
.trigger('mousedown', {
button: 0,
clientX: coordsDrag.x,
Expand Down
1 change: 1 addition & 0 deletions cypress/support/server.js
Original file line number Diff line number Diff line change
Expand Up @@ -900,6 +900,7 @@ export const mockPutItemLogin = (items, shouldThrowError) => {
const id = url.slice(API_HOST.length).split('/')[2];
const item = getItemById(items, id);

// todo: is it intentionnal to erase any extras present before ?
item.extra = buildItemLoginSchemaExtra(body.loginSchema);

reply(item);
Expand Down
40 changes: 20 additions & 20 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,16 @@
"dependencies": {
"@emotion/react": "11.10.5",
"@emotion/styled": "11.10.5",
"@graasp/chatbox": "github:graasp/graasp-chatbox#v1.0.0",
"@graasp/query-client": "github:graasp/graasp-query-client.git",
"@graasp/chatbox": "1.0.0",
"@graasp/query-client": "0.1.0",
"@graasp/sdk": "0.2.0",
"@graasp/translations": "1.2.1",
"@graasp/translations": "1.2.0",
"@graasp/ui": "0.7.0",
"@mui/icons-material": "5.10.9",
"@mui/icons-material": "5.10.14",
"@mui/lab": "5.0.0-alpha.104",
"@mui/material": "5.10.12",
"@sentry/react": "7.17.4",
"@sentry/tracing": "7.17.4",
"@mui/material": "5.10.14",
"@sentry/react": "7.29.0",
"@sentry/tracing": "7.29.0",
"@uppy/core": "2.1.6",
"@uppy/dashboard": "2.1.4",
"@uppy/drag-drop": "2.0.6",
Expand Down Expand Up @@ -64,8 +64,8 @@
"eject": "react-scripts eject",
"lint": "eslint .",
"type-check": "tsc --noEmit",
"prettier:check": "prettier --check src/**/*.{js,json}",
"prettier:write": "prettier --write src/**/*.{js,json}",
"prettier:check": "prettier --check src/**/*.{js,ts,tsx,json}",
"prettier:write": "prettier --write src/**/*.{js,ts,tsx,json}",
"cypress:open": "env-cmd -f ./.env.test cypress open",
"cypress": "concurrently \"yarn start:test\" \"wait-on http://localhost:3111 && yarn cypress:run\"",
"cypress:run": "env-cmd -f ./.env.test cypress run --headless --browser chrome --spec \"cypress/**/*.cy.js\"",
Expand Down Expand Up @@ -95,15 +95,15 @@
"@babel/eslint-parser": "7.19.1",
"@babel/eslint-plugin": "7.19.1",
"@babel/preset-react": "7.18.6",
"@commitlint/cli": "17.2.0",
"@commitlint/config-conventional": "17.2.0",
"@commitlint/cli": "17.4.1",
"@commitlint/config-conventional": "17.4.0",
"@cypress/code-coverage": "3.10.0",
"@cypress/instrument-cra": "1.4.0",
"@graasp/websockets": "github:graasp/graasp-websockets.git",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^12.1.4",
"@testing-library/user-event": "^13.5.0",
"@trivago/prettier-plugin-sort-imports": "3.4.0",
"@trivago/prettier-plugin-sort-imports": "4.0.0",
"@types/jest": "29.0.3",
"@types/lodash.truncate": "4.4.7",
"@types/node": "18.7.21",
Expand All @@ -113,8 +113,8 @@
"@types/uuid": "8.3.4",
"@typescript-eslint/eslint-plugin": "5.42.0",
"@typescript-eslint/parser": "5.42.0",
"concurrently": "7.5.0",
"cypress": "11.0.1",
"concurrently": "7.6.0",
"cypress": "12.3.0",
"cypress-localstorage-commands": "2.2.1",
"env-cmd": "10.1.0",
"eslint": "^7.31.0",
Expand All @@ -125,27 +125,27 @@
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsx-a11y": "6.4.1",
"eslint-plugin-react": "7.22.0",
"husky": "7.0.4",
"husky": "8.0.3",
"istanbul-lib-coverage": "3.2.0",
"npm-run-all": "4.1.5",
"nyc": "15.1.0",
"prettier": "2.7.1",
"prettier": "2.8.2",
"react-app-rewired": "2.2.1",
"standard-version": "9.5.0",
"typescript": "4.8.4",
"wait-on": "6.0.1"
"typescript": "4.9.4",
"wait-on": "7.0.1"
},
"resolutions": {
"node-forge": "1.3.0",
"nth-check": "2.0.1",
"i18next": "21.8.1",
"immer": "9.0.6",
"immutable": "4.1.0",
"glob-parent": "5.1.2",
"browserslist": "4.16.5",
"ansi-html": "0.0.8",
"react-error-overlay": "6.0.9",
"@mui/icons-material": "5.10.9",
"@mui/material": "5.10.10"
"@graasp/sdk": "0.2.0"
},
"packageManager": "[email protected]"
}
7 changes: 0 additions & 7 deletions scripts/start.sh

This file was deleted.

48 changes: 28 additions & 20 deletions src/components/item/form/AppForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ import Autocomplete from '@mui/material/Autocomplete';
import Skeleton from '@mui/material/Skeleton';
import Typography from '@mui/material/Typography';

import { FC, useState } from 'react';
import { FC, HTMLAttributes, useState } from 'react';

import { Item } from '@graasp/sdk';
import { AppItemExtra, Item, UnknownExtra } from '@graasp/sdk';
import { BUILDER } from '@graasp/translations';

import { useBuilderTranslation } from '../../../config/i18n';
Expand All @@ -30,29 +30,23 @@ type App = {
};

type Props = {
onChange: (item: Partial<Item>) => void;
item: Partial<Item>;
updatedProperties: Partial<
| Item
| {
extra: {
app: {
url: string;
};
};
}
>;
onChange: (item: Partial<Item<UnknownExtra>>) => void;
item: Partial<Item<UnknownExtra>>;
updatedProperties: Partial<Item<UnknownExtra>>;
};

const AppForm: FC<Props> = ({ onChange, item, updatedProperties = {} }) => {
const { t: translateBuilder } = useBuilderTranslation();
const [newName, setNewName] = useState(item?.name);

// todo: not clear if newValue is a string or object
const handleAppSelection = (_event: any, newValue: RecordOf<App>) => {
const handleAppSelection = (_event: any, newValue: RecordOf<App> | null) => {
const url = newValue?.url;
const name = newValue?.name ?? item?.name;
const props = { ...item, extra: buildAppExtra({ url }) };
const props = {
...item,
extra: buildAppExtra({ url }),
};
if (name) {
setNewName(name);
props.name = name;
Expand All @@ -68,7 +62,7 @@ const AppForm: FC<Props> = ({ onChange, item, updatedProperties = {} }) => {
const { useApps } = hooks;
const { data, isLoading: isAppsLoading } = useApps();

const url = getAppExtra(item?.extra)?.url;
const url = getAppExtra(item?.extra as AppItemExtra)?.url;

return (
<div>
Expand All @@ -87,12 +81,26 @@ const AppForm: FC<Props> = ({ onChange, item, updatedProperties = {} }) => {
<Autocomplete
id={ITEM_FORM_APP_URL_ID}
options={data?.toArray() ?? []}
getOptionLabel={(option) => option.url ?? option}
value={url}
getOptionLabel={(option) => {
if (typeof option === 'string') {
return option;
}
return option.url;
}}
filterOptions={(options, state) => {
const filteredOptionsByName = options.filter((opt: RecordOf<App>) =>
opt.name.includes(state.inputValue),
);
return filteredOptionsByName;
}}
value={data.find((app) => app.url === url) || url}
clearOnBlur={false}
onChange={handleAppSelection}
onInputChange={handleAppInput}
renderOption={(props: Record<string, unknown>, option: App) => (
renderOption={(
props: HTMLAttributes<HTMLLIElement>,
option: RecordOf<App>,
) => (
<li
// eslint-disable-next-line react/jsx-props-no-spreading
{...props}
Expand Down
8 changes: 4 additions & 4 deletions src/components/item/form/BaseItemForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,16 @@ import { TextField } from '@mui/material';

import { ChangeEvent, FC } from 'react';

import { Item } from '@graasp/sdk';
import { Item, UnknownExtra } from '@graasp/sdk';
import { BUILDER } from '@graasp/translations';

import { useBuilderTranslation } from '../../../config/i18n';
import { ITEM_FORM_NAME_INPUT_ID } from '../../../config/selectors';

type Props = {
updatedProperties: Partial<Item>;
onChange: (props: Partial<Item>) => void;
item: Partial<Item>;
updatedProperties: Partial<Item<UnknownExtra>>;
onChange: (props: Partial<Item<UnknownExtra>>) => void;
item: Partial<Item<UnknownExtra>>;
};

const BaseForm: FC<Props> = ({ onChange, item, updatedProperties }) => {
Expand Down
4 changes: 2 additions & 2 deletions src/components/item/header/ItemHeaderActions.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Map, Record } from 'immutable';
import { Record } from 'immutable';
import PropTypes from 'prop-types';

import EditIcon from '@mui/icons-material/Edit';
Expand Down Expand Up @@ -137,7 +137,7 @@ ItemHeaderActions.defaultProps = {
onClickMetadata: () => {},
// eslint-disable-next-line @typescript-eslint/no-empty-function
onClickChatbox: () => {},
item: Map(),
item: Record({})(),
};

export default ItemHeaderActions;
1 change: 0 additions & 1 deletion src/components/item/publish/CCLicenseSelection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ import CCLicenseDialog from './CCLicenseDialog';
const { EDIT_ITEM } = MUTATION_KEYS;

// TODO: export in graasp sdk
// eslint-disable-next-line
enum CCLicenseAdaption {
ALLOW = 'allow',
ALIKE = 'alike',
Expand Down
2 changes: 2 additions & 0 deletions src/components/item/publish/ItemPublishTab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,8 @@ const ItemPublishTab: FC<Props> = ({
const validationStatusesMap = new Map(
// todo: fix with query client
(ivStatuses as List<any>)
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
?.concat(ivrStatuses)
?.map((entry) => [entry?.id, entry?.name]),
);
Expand Down
Loading

0 comments on commit 80795c9

Please sign in to comment.