Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Resdesign issues #900

Open
wants to merge 11 commits into
base: develop
Choose a base branch
from
2 changes: 1 addition & 1 deletion studio/Dockerfile
Original file line number Diff line number Diff line change
@@ -13,4 +13,4 @@ RUN npm install --legacy-peer-deps
COPY . ./

# start app
CMD ["npm", "start"]
CMD ["npm", "start"]
22 changes: 11 additions & 11 deletions studio/src/components/GlobalNav/MobileSidebar.js
Original file line number Diff line number Diff line change
@@ -92,7 +92,7 @@ function MobileSidebar({ superOrg, permission, orgs, loading, applications, serv
children.map((route, childIndex) => {
return resource.includes(route.title.toLowerCase()) ? (
['Events', 'Permissions'].indexOf(route.title) !== -1 &&
route.isAdmin !== superOrg.is_admin ? null : (
route.isAdmin !== superOrg.is_admin ? null : (
<Menu.Item key={route.menuKey}>
<Link to={route.path} onClick={onClose}>
<span>{route.title}</span>
@@ -165,7 +165,7 @@ function MobileSidebar({ superOrg, permission, orgs, loading, applications, serv
<Avatar
src={
details[selected]?.fav_icon?.url?.[
window.REACT_APP_ENABLE_IMGPROXY ? 'proxy' : 'raw'
window.REACT_APP_ENABLE_IMGPROXY ? 'proxy' : 'raw'
] || degaImg
}
/>
@@ -209,7 +209,7 @@ function MobileSidebar({ superOrg, permission, orgs, loading, applications, serv
}}
>
<div>
<Link style={{ ...buttonStyle, color: '#1E1E1E' }} to='/settings' onClick={onClose}>
<Link style={{ ...buttonStyle, color: '#1E1E1E' }} to="/settings" onClick={onClose}>
<SettingOutlined />
</Link>
{applications.length > 0 ? (
@@ -279,14 +279,14 @@ function MobileSidebar({ superOrg, permission, orgs, loading, applications, serv
return menu.title === 'CORE' && !showCoreMenu
? null
: !menu.isService
? !menu.isAdmin
? getSubMenuItems(menu, index, Icon)
: permission.filter((each) => each.resource === 'admin').length > 0
? getSubMenuItems(menu, index, Icon)
: null
: services?.includes(maker(menu.title))
? getSubMenuItems(menu, index, Icon)
: null;
? !menu.isAdmin
? getSubMenuItems(menu, index, Icon)
: permission.filter((each) => each.resource === 'admin').length > 0
? getSubMenuItems(menu, index, Icon)
: null
: services?.includes(maker(menu.title))
? getSubMenuItems(menu, index, Icon)
: null;
})}
</Menu>
</Drawer>
2 changes: 1 addition & 1 deletion studio/src/components/List/index.js
Original file line number Diff line number Diff line change
@@ -180,7 +180,7 @@ function PostList({ actions, format, filters, onPagination, data, fetchPosts, qu
icon={<ThreeDotIcon style={{ color: '#858585' }} />}
onClick={(e) => {
e.stopPropagation();
alert('this do nothing');
// alert('this do nothing');
}}
/>
</div>
4 changes: 2 additions & 2 deletions studio/src/components/Template/index.js
Original file line number Diff line number Diff line change
@@ -47,7 +47,7 @@ function Template({ format }) {
};

const genExtra = () => (
<div onClick={(e) => e.stopPropagation()}>
<div>
<Button
onClick={() => {
setShow(!show);
@@ -81,7 +81,7 @@ function Template({ format }) {
if (posts.length === 0) return null;

return (
<Collapse defaultActiveKey={[]} style={{ marginBottom: '0.75rem' }}>
<Collapse defaultActiveKey={[]} style={{ marginBottom: '0.75rem' }} className="template-list">
<Panel header="Templates" key="1" extra={genExtra()}>
<List
grid={{ gutter: 16, column: 5 }}
5 changes: 5 additions & 0 deletions studio/src/index.css
Original file line number Diff line number Diff line change
@@ -62,3 +62,8 @@ code {
.edit-form .ant-collapse-header {
font-weight: 600 !important;
}

.template-list .ant-collapse-header {
font-weight: 600 !important;
align-items: center !important;
}
30 changes: 16 additions & 14 deletions studio/src/pages/categories/index.js
Original file line number Diff line number Diff line change
@@ -140,26 +140,28 @@ function Categories({ permission }) {
</Col>
<Col>
{searchFieldExpand ? (
<Row>
<Form.Item name="q">
<Input placeholder="Search categories" />
</Form.Item>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
<Row gutter={8}>
<Col>
<Form.Item name="q">
<Input placeholder="Search categories" />
{/**/}
</Form.Item>
</Col>
<Col>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
</Col>
</Row>
) : (
<Tooltip title="search">
<Button
type="text"
shape="circle"
onFocus={() => {
onClick={() => {
setSearchFieldExpand(true);
setTimeout(() => {
form.getFieldsValue().q === undefined && setSearchFieldExpand(false);
}, 10000);
}}
icon={<SearchOutlined />}
/>
@@ -177,7 +179,7 @@ function Categories({ permission }) {
disabled={!(actions.includes('admin') || actions.includes('create'))}
type="primary"
icon={<PlusOutlined />}
style={{ marginBottom: '1.5rem' }}
style={{ margin: isMobileScreen ? '16px 0' : '0 0 16px 0' }}
>
Create
</Button>
30 changes: 16 additions & 14 deletions studio/src/pages/claimants/index.js
Original file line number Diff line number Diff line change
@@ -139,26 +139,28 @@ function Claimants({ permission }) {
</Col>
<Col>
{searchFieldExpand ? (
<Row>
<Form.Item name="q">
<Input placeholder="Search pages" />
</Form.Item>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
<Row gutter={8}>
<Col>
<Form.Item name="q">
<Input placeholder="Search claimants" />
{/**/}
</Form.Item>
</Col>
<Col>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
</Col>
</Row>
) : (
<Tooltip title="search">
<Button
shape="circle"
style={{ border: 'none' }}
onFocus={() => {
onClick={() => {
setSearchFieldExpand(true);
setTimeout(() => {
form.getFieldsValue().q === undefined && setSearchFieldExpand(false);
}, 10000);
}}
icon={<SearchOutlined />}
/>
@@ -176,7 +178,7 @@ function Claimants({ permission }) {
disabled={!(actions.includes('admin') || actions.includes('create'))}
type="primary"
icon={<PlusOutlined />}
style={{ marginBottom: 16 }}
style={{ margin: isMobileScreen ? '16px 0' : '0 0 16px 0' }}
>
Create
</Button>
30 changes: 16 additions & 14 deletions studio/src/pages/claims/index.js
Original file line number Diff line number Diff line change
@@ -154,26 +154,28 @@ function Claims({ permission }) {
</Col>
<Col>
{searchFieldExpand ? (
<Row>
<Form.Item name="q">
<Input placeholder="Search pages" />
</Form.Item>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
<Row gutter={8}>
<Col>
<Form.Item name="q">
<Input placeholder="Search claims" />
{/**/}
</Form.Item>
</Col>
<Col>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
</Col>
</Row>
) : (
<Tooltip title="search">
<Button
shape="circle"
type="text"
onFocus={() => {
onClick={() => {
setSearchFieldExpand(true);
setTimeout(() => {
form.getFieldsValue().q === undefined && setSearchFieldExpand(false);
}, 10000);
}}
icon={<SearchOutlined />}
/>
@@ -191,7 +193,7 @@ function Claims({ permission }) {
disabled={!(actions.includes('admin') || actions.includes('create'))}
type="primary"
icon={<PlusOutlined />}
style={{ marginBottom: 16 }}
style={{ margin: isMobileScreen ? '16px 0' : '0 0 16px 0' }}
>
Create
</Button>
30 changes: 16 additions & 14 deletions studio/src/pages/episodes/index.js
Original file line number Diff line number Diff line change
@@ -158,27 +158,29 @@ function Episodes({ permission }) {
</Col>
<Col>
{searchFieldExpand ? (
<Row>
<Form.Item name="q">
<Input placeholder="Search podcasts" />
</Form.Item>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
<Row gutter={8}>
<Col>
<Form.Item name="q">
<Input placeholder="Search episodes" />
{/**/}
</Form.Item>
</Col>
<Col>
<Form.Item>
<Button htmlType="submit" icon={<SearchOutlined />}>
Search
</Button>
</Form.Item>
</Col>
</Row>
) : (
<Tooltip title="search">
<Button
shape="circle"
// style={{ border: 'none' }}
type="text"
onFocus={() => {
onClick={() => {
setSearchFieldExpand(true);
setTimeout(() => {
form.getFieldsValue().q === undefined && setSearchFieldExpand(false);
}, 10000);
}}
icon={<SearchOutlined />}
/>
@@ -196,7 +198,7 @@ function Episodes({ permission }) {
disabled={!(actions.includes('admin') || actions.includes('create'))}
type="primary"
icon={<PlusOutlined />}
style={{ marginBottom: 16 }}
style={{ margin: isMobileScreen ? '16px 0' : '0 0 16px 0' }}
>
Create
</Button>
49 changes: 28 additions & 21 deletions studio/src/pages/fact-checks/components/FactCheckForm.js
Original file line number Diff line number Diff line change
@@ -100,7 +100,7 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
setClaimCreatedFlag(false);
}

useEffect(() => {}, [details, loading]);
useEffect(() => { }, [details, loading]);

const [drawerVisible, setDrawerVisible] = useState(false);
const showDrawer = () => {
@@ -135,8 +135,8 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
values.status = status;
values.status === 'publish'
? (values.published_date = values.published_date
? dayjs(values.published_date).format('YYYY-MM-DDTHH:mm:ssZ')
: getCurrentDate())
? dayjs(values.published_date).format('YYYY-MM-DDTHH:mm:ssZ')
: getCurrentDate())
: (values.published_date = null);
onCreate(values);
};
@@ -299,8 +299,8 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
</p>
) : null}
{form.getFieldValue('claims') &&
form.getFieldValue('claims').length > 0 &&
!loading ? (
form.getFieldValue('claims').length > 0 &&
!loading ? (
<Form.Item name="claimOrder">
<ClaimList
ids={form.getFieldValue('claims')}
@@ -318,7 +318,7 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
initialValue={data.description_html}
/>
<Drawer
title={<h4 style={{ fontWeight: 'bold' }}>Post Settings</h4>}
title={<h4 style={{ fontWeight: 'bold', marginTop: "0.5rem" }}>Post Settings</h4>}
placement="right"
closable={true}
onClose={onClose}
@@ -329,8 +329,9 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
<Form.Item name="featured_medium_id" label="Featured Image">
<MediaSelector />
</Form.Item>
<Form.Item name="claims" label="Claims" key={!visible}>
<Selector mode="multiple" display={'claim'} action="Claims" />
<Form.Item name="claims" key={!visible}>
<label>Claims</label>
<Selector mode="multiple" display={'claim'} action="Claims" style={{ width: '100%', marginTop: "0.5rem" }} />
</Form.Item>
<Form.Item>
<Button type="primary" onClick={showModal}>
@@ -339,26 +340,32 @@ function FactCheckForm({ onCreate, data = {}, actions = {}, format }) {
</Form.Item>
<Form.Item
name="excerpt"
label="Excerpt"
rules={[{ max: 5000, message: 'Excerpt must be a maximum of 5000 characters.' }]}
>
<Input.TextArea rows={4} placeholder="Excerpt" style={{ fontSize: 'medium' }} />
<label>Excerpt</label>
<Input.TextArea rows={4} placeholder="Excerpt"
style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<Form.Item name="subtitle" label="Subtitle">
<Input placeholder="Subtitle" style={{ fontSize: 'medium' }} />
<Form.Item name="subtitle">
<label>Subtitle</label>
<Input placeholder="Subtitle" style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<SlugInput />
<Form.Item name="published_date" label="Published Date">
<DatePicker />
<SlugInput style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }}/>
<Form.Item name="published_date" >
<label>Publish Date</label>
<DatePicker style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<Form.Item name="categories" label="Categories">
<Selector mode="multiple" action="Categories" createEntity="Category" />
<Form.Item name="categories">
<label>Categories</label>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://ant.design/components/form . cant we use the layout prop instead of manually adding labels .

Screenshot 2023-06-28 at 4 58 34 PM

Copy link
Contributor

@ishpaul777 ishpaul777 Jun 28, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is it an issue on antd or on our end ?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Faced this issue quite a few times couldn't figure out reason,

<Selector mode="multiple" action="Categories" createEntity="Category" style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<Form.Item name="tags" label="Tags">
<Selector mode="multiple" action="Tags" createEntity="Tag" />
<Form.Item name="tags">
<label>Tags</label>
<Selector mode="multiple" action="Tags" createEntity="Tag" style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<Form.Item name="authors" label="Authors">
<Selector mode="multiple" display={'display_name'} action="Authors" />
<Form.Item name="authors">
<label>Authors</label>
<Selector mode="multiple" display={'display_name'} action="Authors" style={{ width: '100%', marginTop: "0.5rem", fontSize: 'medium' }} />
</Form.Item>
<Form.Item>
<Button style={{ width: '100%' }} onClick={() => setMetaDrawer(true)}>
Loading