mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-03-22 03:29:42 +01:00
Code Issues Releases Wiki Activity

fix sharing n err handling

Browse Source
This commit is contained in:
Kushagra Gour 2024-03-13 19:39:31 +05:30
parent f28b5405a0
commit e87d4ed213
3 changed files with 65 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Icons.jsx
View File

@ -119,6 +119,12 @@ export function Icons() {
<symbol id="view-list" viewBox="0 0 24 24">
<path d="M9,5V9H21V5M9,19H21V15H9M9,14H21V10H9M4,9H8V5H4M4,19H8V15H4M4,14H8V10H4V14Z" />
</symbol>
<symbol id="eye" viewBox="0 0 24 24">
<path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Z" />
</symbol>
<symbol id="eye-striked" viewBox="0 0 24 24">
<path d="M11.83 9 15 12.16V12a3 3 0 0 0-3-3h-.17m-4.3.8 1.55 1.55c-.05.21-.08.42-.08.65a3 3 0 0 0 3 3c.22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53a5 5 0 0 1-5-5c0-.79.2-1.53.53-2.2M2 4.27l2.28 2.28.45.45C3.08 8.3 1.78 10 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.43.42L19.73 22 21 20.73 3.27 3M12 7a5 5 0 0 1 5 5c0 .64-.13 1.26-.36 1.82l2.93 2.93c1.5-1.25 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-4 .7l2.17 2.15C10.74 7.13 11.35 7 12 7Z" />
</symbol>
<symbol id="loader-icon" viewBox="0 0 44 44">
{/* By Sam Herbert (@sherb), for everyone. More http://goo.gl/7AJzbL */}
<g fill="none" fillRule="evenodd" strokeWidth={10}>
@ -173,9 +179,15 @@ export function Icons() {
);
}
export const Icon = ({ name, ...rest }) => {
export const Icon = ({ name, color, size, ...rest }) => {
return (
<svg xmlns="http://www.w3.org/2000/svg" {...rest}>
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
style={{ fill: color }}
{...rest}
>
<use xlinkHref={`#${name}`} />
</svg>
);

34
src/components/ItemTile.jsx
View File

@ -1,7 +1,8 @@
import { h } from 'preact';
import { getHumanDate } from '../utils';
import Modal from './Modal';
import { HStack } from './Stack';
import { HStack, Stack } from './Stack';
import { Icon } from './Icons';
export function ItemTile({
item,
@ -23,26 +24,6 @@ export function ItemTile({
onClick={onClick}
>
<div class="saved-item-tile__btns">
{onToggleVisibilityBtnClick ? (
<button
class="js-saved-item-tile__fork-btn saved-item-tile__btn hint--left hint--medium"
aria-label="Creates a duplicate of this creation (Ctrl/⌘ + F)"
onClick={onToggleVisibilityBtnClick}
>
Toggle Visibility
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
>
{item.isPublic ? (
<path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Z" />
) : (
<path d="M11.83 9 15 12.16V12a3 3 0 0 0-3-3h-.17m-4.3.8 1.55 1.55c-.05.21-.08.42-.08.65a3 3 0 0 0 3 3c.22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53a5 5 0 0 1-5-5c0-.79.2-1.53.53-2.2M2 4.27l2.28 2.28.45.45C3.08 8.3 1.78 10 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.43.42L19.73 22 21 20.73 3.27 3M12 7a5 5 0 0 1 5 5c0 .64-.13 1.26-.36 1.82l2.93 2.93c1.5-1.25 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-4 .7l2.17 2.15C10.74 7.13 11.35 7 12 7Z" />
)}
</svg>
</button>
) : null}
{onForkBtnClick ? (
<button
class="js-saved-item-tile__fork-btn saved-item-tile__btn hint--left hint--medium"
@ -113,7 +94,16 @@ export function ItemTile({
</>
) : null}
</div>
<div>right</div>
<div>
<Stack gap={1} align="center">
<Icon
size="16"
color="currentColor"
name={item.isPublic ? 'eye' : 'eye-striked'}
/>
{item.isPublic ? 'Public' : ''}
</Stack>
</div>
</HStack>
</div>
</div>

62
src/components/Share.jsx
View File

@ -5,6 +5,7 @@ import Switch from './Switch';
import { itemService } from '../itemService';
import { alertsService } from '../notifications';
import { Button } from './common';
import { Icon } from './Icons';
const FREE_PUBLIC_ITEM_COUNT = 1;
const BASE_URL = location.origin;
@ -25,9 +26,18 @@ export function Share({ user, item, onVisibilityChange }) {
setVal(newVal);
if (newVal) {
const token = await window.user.getIdToken();
const res = await fetch(
`http://127.0.0.1:5001/web-maker-app/us-central1/toggleVisibility?token=${token}&itemId=${item.id}`
);
let res;
try {
res = await fetch(
`http://127.0.0.1:5001/web-maker-app/us-central1/toggleVisibility?token=${token}&itemId=${item.id}`
);
} catch (e) {
alertsService.add('Could not change visibility');
setTimeout(() => {
setVal(!newVal);
}, 1000);
return;
}
if (res.status >= 200 && res.status < 400) {
setPublicItemCount(publicItemCount + 1);
@ -50,26 +60,32 @@ export function Share({ user, item, onVisibilityChange }) {
};
return (
<VStack gap={4} align="stretch">
<VStack gap={1} align="stretch">
<Switch
checked={val}
onChange={onChange}
labels={['Private', 'Public']}
>
Access
</Switch>
{item.isPublic && (
<p>
Public at{' '}
<a href={`${BASE_URL}/create/${item.id}`} target="_blank">
{BASE_URL}/create/{item.id}
</a>{' '}
<Button class="btn btn--dark" onClick={copyUrl}>
Copy
</Button>
</p>
)}
</VStack>
<div style="min-width: 46ch">
<VStack gap={1} align="stretch">
<Switch
checked={val}
onChange={onChange}
labels={['Private', 'Public']}
>
Access
</Switch>
{item.isPublic && (
<p>
Public at{' '}
<a href={`${BASE_URL}/create/${item.id}`} target="_blank">
{BASE_URL}/create/{item.id}
</a>{' '}
<Button
class="btn btn--dark hint--bottom hint--rounded"
onClick={copyUrl}
aria-label="Copy"
>
<Icon name="copy" />
</Button>
</p>
)}
</VStack>
</div>
{!user?.isPro ? (
<VStack gap={1} align="stretch">