SAM2.1

SAM2.1 checkpoints + training code + Demo

demo/frontend/src/graphql/RelayEnvironment.ts

@@ -0,0 +1,53 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import Logger from '@/common/logger/Logger';
+import {
+  CacheConfig,
+  Environment,
+  FetchFunction,
+  GraphQLResponse,
+  LogEvent,
+  Network,
+  ObservableFromValue,
+  RecordSource,
+  RequestParameters,
+  Store,
+  UploadableMap,
+  Variables,
+} from 'relay-runtime';
+import fetchGraphQL from './fetchGraphQL';
+
+function createFetchRelay(endpoint: string): FetchFunction {
+  return (
+    request: RequestParameters,
+    variables: Variables,
+    cacheConfig: CacheConfig,
+    uploadables?: UploadableMap | null,
+  ): ObservableFromValue<GraphQLResponse> => {
+    Logger.debug(
+      `fetching query ${request.name} with ${JSON.stringify(variables)}`,
+    );
+    return fetchGraphQL(endpoint, request, variables, cacheConfig, uploadables);
+  };
+}
+
+export function createEnvironment(endpoint: string): Environment {
+  return new Environment({
+    log: (logEvent: LogEvent) => Logger.debug(logEvent.name, logEvent),
+    network: Network.create(createFetchRelay(endpoint)),
+    store: new Store(new RecordSource()),
+  });
+}

demo/frontend/src/graphql/RelayEnvironmentProvider.tsx

@@ -0,0 +1,65 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import ErrorFallback from '@/common/error/ErrorFallback';
+import LoadingMessage from '@/common/loading/LoadingMessage';
+import {createEnvironment} from '@/graphql/RelayEnvironment';
+import {
+  ComponentType,
+  PropsWithChildren,
+  ReactNode,
+  Suspense,
+  useMemo,
+  useState,
+} from 'react';
+import {ErrorBoundary, FallbackProps} from 'react-error-boundary';
+import {RelayEnvironmentProvider} from 'react-relay';
+
+type Props = PropsWithChildren<{
+  suspenseFallback?: ReactNode;
+  errorFallback?: ComponentType<FallbackProps>;
+  endpoint: string;
+}>;
+
+export default function OnevisionRelayEnvironmentProvider({
+  suspenseFallback,
+  errorFallback = ErrorFallback,
+  endpoint,
+  children,
+}: Props) {
+  const [retryKey, setRetryKey] = useState<number>(0);
+
+  const environment = useMemo(() => {
+    return createEnvironment(endpoint);
+    // The retryKey is needed to force a new Relay Environment
+    // instance when the user retries after an error occurred.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [endpoint, retryKey]);
+
+  // Force re-creating Relay Environment
+  function handleReset() {
+    setRetryKey(k => k + 1);
+  }
+
+  return (
+    <ErrorBoundary onReset={handleReset} FallbackComponent={errorFallback}>
+      <RelayEnvironmentProvider environment={environment}>
+        <Suspense fallback={suspenseFallback ?? <LoadingMessage />}>
+          {children}
+        </Suspense>
+      </RelayEnvironmentProvider>
+    </ErrorBoundary>
+  );
+}

demo/frontend/src/graphql/errors/CreateFilmstripError.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export default class CreateFilmstripError extends Error {
+  override name = 'CreateFilmstripError';
+  constructor(message?: string) {
+    super(message);
+  }
+}

demo/frontend/src/graphql/errors/DrawFrameError.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export default class DrawFrameError extends Error {
+  override name = 'DrawFrameError';
+  constructor(message?: string) {
+    super(message);
+  }
+}

demo/frontend/src/graphql/errors/WebGLContextError.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export default class WebGLContextError extends Error {
+  override name = 'WebGLContextError';
+  constructor(message?: string) {
+    super(message);
+  }
+}

demo/frontend/src/graphql/fetchGraphQL.ts

@@ -0,0 +1,104 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import Logger from '@/common/logger/Logger';
+import {
+  CacheConfig,
+  GraphQLResponse,
+  RequestParameters,
+  UploadableMap,
+  Variables,
+} from 'relay-runtime';
+
+/**
+ * Inspired by https://github.com/facebook/relay/issues/1844
+ */
+export default async function fetchGraphQL(
+  endpoint: string,
+  request: RequestParameters,
+  variables: Variables,
+  cacheConfig: CacheConfig,
+  uploadables?: UploadableMap | null,
+): Promise<GraphQLResponse> {
+  const url = `${endpoint}/graphql`;
+
+  const headers: {[name: string]: string} = {};
+  const requestInit: RequestInit = {
+    method: 'POST',
+    headers,
+    credentials: 'include',
+  };
+
+  const customHeaders = (cacheConfig?.metadata?.headers ?? {}) as {
+    [key: string]: string;
+  };
+
+  requestInit.headers = Object.assign(customHeaders, requestInit.headers);
+
+  if (uploadables != null) {
+    const formData = new FormData();
+    formData.append(
+      'operations',
+      JSON.stringify({
+        query: request.text,
+        variables,
+      }),
+    );
+
+    const uploadableMap: {
+      [key: string]: string[];
+    } = {};
+
+    Object.keys(uploadables).forEach(key => {
+      uploadableMap[key] = [`variables.${key}`];
+    });
+
+    formData.append('map', JSON.stringify(uploadableMap));
+
+    Object.keys(uploadables).forEach(key => {
+      formData.append(key, uploadables[key]);
+    });
+
+    requestInit.body = formData;
+  } else {
+    requestInit.headers = Object.assign(
+      {'Content-Type': 'application/json'},
+      requestInit.headers,
+    );
+
+    requestInit.body = JSON.stringify({
+      query: request.text,
+      variables,
+    });
+  }
+
+  try {
+    const response = await fetch(url, requestInit);
+    const result = await response.json();
+
+    // Handle any intentional GraphQL errors, which are passed through the
+    // errors property in the JSON payload.
+    if ('errors' in result) {
+      for (const error of result.errors) {
+        Logger.error(error);
+      }
+    }
+
+    return result;
+  } catch (error) {
+    Logger.error(`Could not connect to GraphQL endpoint ${url}`, error);
+    throw error;
+  }
+}