Skip to content

Commit

Permalink
Merge branch 'cofacts:master' into master
Browse files Browse the repository at this point in the history
  • Loading branch information
@marcussfu
marcussfu committed Feb 27, 2024
2 parents 9ac65ea + 00dcd7a commit eee4408
Show file tree
Hide file tree
Showing 26 changed files with 1,041 additions and 656 deletions.
1 change: 1 addition & 0 deletions .dockerignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,3 +15,4 @@
!pages/*
!typegen/*
!tsconfig.json
!LEGAL.md
2 changes: 1 addition & 1 deletion Dockerfile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ EXPOSE 3000
# Note: using npm start here will cause error when exiting the container
CMD ["node_modules/.bin/pm2-runtime", "ecosystem.config.js"]

COPY package.json package-lock.json next.config.js ecosystem.config.js server.js ./
COPY package.json package-lock.json next.config.js ecosystem.config.js server.js LEGAL.md ./
COPY --from=builder /srv/www/.next ./.next
COPY --from=builder /srv/www/public ./public
COPY --from=builder /srv/www/node_modules ./node_modules
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ For production via [rumors-deploy](http://github.com/cofacts/rumors-deploy), do

## Development

This project uses NodeJS 16+.
This project uses NodeJS 16. Use a node version manager like `nvm` to install version 16 (ex. `nvm install 16`)

``` bash
$ npm install
Expand Down
10 changes: 6 additions & 4 deletions codegen.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,17 @@ import { CodegenConfig } from '@graphql-codegen/cli';
const config: CodegenConfig = {
// schema: 'http://localhost:5000/graphql',
schema: 'https://dev-api.cofacts.tw/graphql',
documents: ['pages/**/*.tsx?', 'components/**/*.tsx?', 'lib/**/*.tsx'],
documents: [
'pages/**/*.{ts,tsx}',
'components/**/*.{ts,tsx}',
'lib/**/*.{ts,tsx}',
],
generates: {
'./typegen/': {
preset: 'client',
plugins: [],
presetConfig: {
// Rename useFragment to avoid conflicting with ESLint React hook rule
// https://the-guild.dev/graphql/codegen/plugins/presets/preset-client#embrace-fragment-masking-principles
fragmentMasking: { unmaskFunctionName: 'getFragmentData' },
fragmentMasking: false,
},
},
},
Expand Down
173 changes: 95 additions & 78 deletions components/AppLayout/AppFooter.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,23 +33,34 @@ const useStyles = makeStyles(theme => ({
},
},
container: {
width: 800,
width: '100%',
maxWidth: 800,
color: theme.palette.text.primary,
gap: 20,
margin: 60,
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'space-between',
},
second: {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
flexFlow: 'row wrap',
padding: 28,
background: theme.palette.secondary[900],
color: theme.palette.secondary[100],
gap: 8,
fontSize: 16,
},
logo: {
width: 275,
height: 'auto',
verticalAlign: 'bottom',
},
column: {
flex: '1 1',
flex: '0 1 auto',
minWidth: 'max-content', // distribute width using longest content in the column
},
linkTextWithIcon: {
marginLeft: 12,
Expand Down Expand Up @@ -89,88 +100,92 @@ const CustomLink = withStyles(theme => ({
</div>
));

function FactCheckSection({ classes }) {
return (
<div className={classes.column}>
<h3>{t`Fact Check`}</h3>
<CustomLink href="/articles">{t`Messages`}</CustomLink>
<CustomLink href="/replies">{c('App layout').t`Replies`}</CustomLink>
<CustomLink href="/hoax-for-you">{c('App layout').t`For You`}</CustomLink>
<CustomLink href="/tutorial">{c('App layout').t`Tutorial`}</CustomLink>
</div>
);
}

function AboutSection({ classes }) {
return (
<div className={classes.column}>
<h3>{t`About`}</h3>
<CustomLink href="/about">{t`About Cofacts`}</CustomLink>
<CustomLink href="/terms">{t`User Agreement`}</CustomLink>
<CustomLink external href={PROJECT_HACKFOLDR}>
{t`Introduction`}
</CustomLink>
<CustomLink external href={PROJECT_SOURCE_CODE}>
{t`Source Code`}
</CustomLink>
<CustomLink external href={PROJECT_MEDIUM}>
Medium
</CustomLink>
<CustomLink href="/impact">{t`Impact Report`}</CustomLink>
</div>
);
}

function ContactSection({ classes, isDesktop }) {
return (
<div className={classes.column}>
<h3>{t`Contact`}</h3>
<CustomLink
external
href={`mailto:${CONTACT_EMAIL}`}
icon={({ className }) => (
<img className={className} src={mailIcon} style={{ width: '30px' }} />
)}
>
{t`Contact Us`}
</CustomLink>
<CustomLink
external
href={EDITOR_FACEBOOK_GROUP}
icon={({ className }) => (
<img
className={className}
src={facebookIcon}
style={{ width: '30px' }}
/>
)}
>
{t`Facebook forum`}
</CustomLink>
<CustomLink
external
href={LINE_URL}
icon={({ className }) => (
<img className={className} src={lineIcon} style={{ width: '30px' }} />
)}
>
Line: @cofacts
</CustomLink>
{isDesktop && <GoogleWebsiteTranslator />}
<CustomLink external href={DONATION_URL}>
{t`Donate to Cofacts`}
</CustomLink>
</div>
);
}

function AppFooter() {
const classes = useStyles();
const matches = useMediaQuery('(min-width:768px)');
const isDesktop = useMediaQuery('(min-width:768px)');

return (
<Box component="footer" display={['none', 'none', 'block']}>
<Box component="footer">
<div className={classes.first}>
<div className={classes.container}>
<div className={classes.column}>
<h3>{t`Fact Check`}</h3>
<CustomLink href="/articles">{t`Messages`}</CustomLink>
<CustomLink href="/replies">
{c('App layout').t`Replies`}
</CustomLink>
<CustomLink href="/hoax-for-you">
{c('App layout').t`For You`}
</CustomLink>
<CustomLink href="/tutorial">
{c('App layout').t`Tutorial`}
</CustomLink>
</div>
<div className={classes.column}>
<h3>{t`About`}</h3>
<CustomLink href="/about">{t`About Cofacts`}</CustomLink>
<CustomLink href="/terms">{t`User Agreement`}</CustomLink>
<CustomLink external href={PROJECT_HACKFOLDR}>
{t`Introduction`}
</CustomLink>
<CustomLink external href={PROJECT_SOURCE_CODE}>
{t`Source Code`}
</CustomLink>
<CustomLink external href={PROJECT_MEDIUM}>
Medium
</CustomLink>
<CustomLink href="/impact">{t`Impact Report`}</CustomLink>
</div>
<div className={classes.column}>
<h3>{t`Contact`}</h3>
<CustomLink
external
href={`mailto:${CONTACT_EMAIL}`}
icon={({ className }) => (
<img
className={className}
src={mailIcon}
style={{ width: '30px' }}
/>
)}
>
{t`Contact Us`}
</CustomLink>
<CustomLink
external
href={EDITOR_FACEBOOK_GROUP}
icon={({ className }) => (
<img
className={className}
src={facebookIcon}
style={{ width: '30px' }}
/>
)}
>
{t`Facebook forum`}
</CustomLink>
<CustomLink
external
href={LINE_URL}
icon={({ className }) => (
<img
className={className}
src={lineIcon}
style={{ width: '30px' }}
/>
)}
>
Line: @cofacts
</CustomLink>
{matches && <GoogleWebsiteTranslator />}
<CustomLink external href={DONATION_URL}>
{t`Donate to Cofacts`}
</CustomLink>
</div>
<FactCheckSection classes={classes} />
<AboutSection classes={classes} />
<ContactSection classes={classes} isDesktop={isDesktop} />
</div>
</div>
<div className={classes.second}>
Expand All @@ -185,6 +200,8 @@ function AppFooter() {
alt="Powered by g0v"
/>
</a>
<div>・</div>
<div>台灣實科協會</div>
</div>
</Box>
);
Expand Down
35 changes: 20 additions & 15 deletions components/Collaborate/CollabEditor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import useCurrentUser from 'lib/useCurrentUser';
import PlaceholderPlugin from './Placeholder';
import getConfig from 'next/config';
import CollabHistory from './CollabHistory';
import { useIsUserBlocked } from 'lib/isUserBlocked';

const {
publicRuntimeConfig: { PUBLIC_COLLAB_SERVER_URL },
Expand Down Expand Up @@ -139,6 +140,7 @@ const CollabEditor = ({ article }) => {
const [showEditor, setShowEditor] = useState(null);
const [isSynced, setIsSynced] = useState(false);
const currentUser = useCurrentUser();
const isUserBlocked = useIsUserBlocked();

// onTranscribe setup provider for both Editor and CollabHistory to use.
// And, to avoid duplicated connection, provider will be destroyed(close connection) when Editor unmounted.
Expand Down Expand Up @@ -208,7 +210,7 @@ const CollabEditor = ({ article }) => {
>
{t`No transcripts yet`}
</Typography>
{!showEditor ? (
{!showEditor && !isUserBlocked ? (
<>
<Button
color="primary"
Expand All @@ -232,20 +234,23 @@ const CollabEditor = ({ article }) => {
>
{t`Transcript`}
</Typography>
{!showEditor ? (
<Button
variant="outlined"
className={classes.editButton}
onClick={onTranscribe}
>
<TranscribePenIcon className={classes.newReplyFabIcon} />
{t`Edit`}
</Button>
) : (
isSynced && (
<CollabHistory ydoc={provider.document} docName={article.id} />
)
)}
{!showEditor
? !isUserBlocked && (
<Button
variant="outlined"
className={classes.editButton}
onClick={onTranscribe}
>
<TranscribePenIcon className={classes.newReplyFabIcon} />
{t`Edit`}
</Button>
)
: isSynced && (
<CollabHistory
ydoc={provider.document}
docName={article.id}
/>
)}
</>
)}
</div>
Expand Down
Loading

0 comments on commit eee4408

Please sign in to comment.