aheimlich Comments - Convex Community

aheimlich

CCConvex Community

•Created by kstulgys on 9/11/2024 in #support-community

Is this is valid Access-Control-Allow-Origin?

Access-Control-Allow-Origin can only accept a single value: Either a full domain name, or * (any origin). If you have multiple domains that you want to allow: - Maintain a list of said domains (i.e. stick them in an array somewhere) - When a request comes in from an allowed domain, send the Access-Control-Allow-Origin: <insert domain here> header - When a request comes in from a not-allowed domain, DO NOT send the Access-Controll-Allow-Origin header More info: https://devdocs.io/http/headers/access-control-allow-origin https://devdocs.io/http/cors

3 replies

CCConvex Community

•Created by FleetAdmiralJakob 🗕 🗗 🗙 on 4/10/2024 in #support-community

Feature Request: API for checking if query/mutation/action is loading

I wonder if you might be able to use useAsync() from @react-hookz/web to help here (at least with mutations and actions)? https://react-hookz.github.io/web/?path=/docs/side-effect-useasync--example

139 replies

CCConvex Community

•Created by Mike Lyons on 11/14/2023 in #support-community

Authing HTTP Action with OAuth2?

The only time I've ever heard the "auth and backend must be on the same root domain" thing before is in the context of browser SDKs for services like Auth0, and in that context it was a way to mitigate cookie-related issues. I'm not sure what reason chatGPT could have for requiring this.

24 replies

CCConvex Community

•Created by Mike Lyons on 11/14/2023 in #support-community

Authing HTTP Action with OAuth2?

Clerk recently added support for using it as an OAuth 2 provider https://clerk.com/docs/advanced-usage/clerk-idp

24 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

Sorry for the delay, here (above) is a very basic code sample tying Uppy to Material UI's Circular Progress Bar component

15 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

import * as React from 'react';
import PropTypes from 'prop-types';
import CircularProgress from '@mui/material/CircularProgress';
import Typography from '@mui/material/Typography';
import Box from '@mui/material/Box';
import Uppy from "@uppy/core";

/**
 * See https://mui.com/material-ui/react-progress/#circular-with-label
 */
function CircularProgressWithLabel(props) {
  return (
    <Box sx={{ position: 'relative', display: 'inline-flex' }}>
      <CircularProgress variant="determinate" {...props} />
      <Box
        sx={{
          top: 0,
          left: 0,
          bottom: 0,
          right: 0,
          position: 'absolute',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        <Typography variant="caption" component="div" color="text.secondary">
          {`${Math.round(props.value)}%`}
        </Typography>
      </Box>
    </Box>
  );
}

CircularProgressWithLabel.propTypes = {
  /**
   * The value of the progress indicator for the determinate variant.
   * Value between 0 and 100.
   * @default 0
   */
  value: PropTypes.number.isRequired,
};

export default function UppyProgressBar(props) {
  const { uppy } = props;
  const [progress, setProgress] = React.useState(0);

  React.useEffect(() => {
    /**
     * See https://uppy.io/docs/uppy/#progress
     */
    const onProgress = (progress) => {
      setProgress(progress);
    };

    /**
     * See https://uppy.io/docs/uppy/#reset-progress
     */
    const onResetProgress = () => {
      setProgress(0);
    };

    uppy
      .on("progress", onProgress)
      .on("reset-progress", onResetProgress);

    return () => {
      uppy
        .off("progress", onProgress)
        .off("reset-progress", onResetProgress);
    };
  }, [uppy]);

  return <CircularProgressWithLabel value={progress} />;
}

UppyProgressBar.propTypes = {
  uppy: PropTypes.instanceOf(Uppy).isRequired
}

import * as React from 'react';
import PropTypes from 'prop-types';
import CircularProgress from '@mui/material/CircularProgress';
import Typography from '@mui/material/Typography';
import Box from '@mui/material/Box';
import Uppy from "@uppy/core";

/**
 * See https://mui.com/material-ui/react-progress/#circular-with-label
 */
function CircularProgressWithLabel(props) {
  return (
    <Box sx={{ position: 'relative', display: 'inline-flex' }}>
      <CircularProgress variant="determinate" {...props} />
      <Box
        sx={{
          top: 0,
          left: 0,
          bottom: 0,
          right: 0,
          position: 'absolute',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        <Typography variant="caption" component="div" color="text.secondary">
          {`${Math.round(props.value)}%`}
        </Typography>
      </Box>
    </Box>
  );
}

CircularProgressWithLabel.propTypes = {
  /**
   * The value of the progress indicator for the determinate variant.
   * Value between 0 and 100.
   * @default 0
   */
  value: PropTypes.number.isRequired,
};

export default function UppyProgressBar(props) {
  const { uppy } = props;
  const [progress, setProgress] = React.useState(0);

  React.useEffect(() => {
    /**
     * See https://uppy.io/docs/uppy/#progress
     */
    const onProgress = (progress) => {
      setProgress(progress);
    };

    /**
     * See https://uppy.io/docs/uppy/#reset-progress
     */
    const onResetProgress = () => {
      setProgress(0);
    };

    uppy
      .on("progress", onProgress)
      .on("reset-progress", onResetProgress);

    return () => {
      uppy
        .off("progress", onProgress)
        .off("reset-progress", onResetProgress);
    };
  }, [uppy]);

  return <CircularProgressWithLabel value={progress} />;
}

UppyProgressBar.propTypes = {
  uppy: PropTypes.instanceOf(Uppy).isRequired
}

15 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

I can throw together a quick code sample sometime tommorrow

15 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

I normally use Uppy's dashboard and customize the CSS. You can also use the status bar completely by itself. However, there was one instance where I tied Uppy to an instance of Material UI's Circular Progress Bar component, because the area I wanted to display upload progress in was simply too small for any of Uppy's built-in UI components.

15 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

Thanks! Uppy is a wonderful library, and I have been using it on various projects for years.

15 replies

CCConvex Community

•Created by whoami on 5/7/2023 in #support-community

Is there a way to get the progress of file uploading in convex storage?

Another option, if you want Convex to store your files, is to use Uppy (https://uppy.io) and configure its XHR uploader (https://uppy.io/docs/xhr-upload/) with either the URL to a HTTP Action, or the URL returned by generateUploadUrl. Uppy itself will handle displaying upload progress, among many other things. You might even be able to write a custom Uppy uploader plugin that uses upload.io's SDK, if you still want to upload files to upload.io.

15 replies