常連

### 実現したいこと

あるユーザーがどのユーザーに対してLikeをしたのか、その情報を保持させるLikeモデルをGraphQLで実装しています。
mutationでCreateLikeFromというメソッドをつくり、`user_id: 1`が`user_id: 3`をLikeする実装をしたいです。
現在の下記のコードでは、クエリを投げてもエラーが出力されてしまいます。
- クエリ
```
mutation {
  createLikeFrom(
    input:{userId: 1, toUserId: 3}
  ){
    likes {
      id
      fromUser {
        id
      }
      toUser {
        id
      }
    }
  }
}
```
どのあたりに問題があるかご教授いただきたいです。

### エラー
赤波線で`Cannot query field "createLikeFrom" on type "Mutation".`と出力される
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-11-13/2c1a4138-c232-4fdc-b272-618b5a655927.png)


### 該当のソースコード

models/user.rb
```ruby
class User < ApplicationRecord
  has_many :likes_from, class_name: "Like", foreign_key: :from_user_id, dependent: :destroy
  has_many :likes_to, class_name: "Like", foreign_key: :to_user_id, dependent: :destroy
  has_many :active_likes, through: :likes_from, source: :to_user 
  has_many :passive_likes, through: :likes_to, source: :from_user
end
```
models/like.rb
```ruby
class Like < ApplicationRecord
  belongs_to :to_user, class_name: "User", foreign_key: :to_user_id
  belongs_to :from_user, class_name: "User", foreign_key: :from_user_id
end
```
graphql/types/user_type.rb
```ruby
module Types
  class UserType < Types::BaseObject
    field :id, ID, null: false
    field :created_at, GraphQL::Types::ISO8601DateTime, null: false
    field :updated_at, GraphQL::Types::ISO8601DateTime, null: false
    field :like, [Types::LikeType], null: false
      def like_from; object.likes_from; end
      def like_to; object.likes_to; end
  end
end
```
graphql/types/like_type.rb
```ruby
module Types
  class LikeType < Types::BaseObject
    field :id, ID, null: false
    field :from_user_id, Integer, null: false
    field :to_user_id, Integer, null: false
    field :created_at, GraphQL::Types::ISO8601DateTime, null: false
    field :updated_at, GraphQL::Types::ISO8601DateTime, null: false
    field :user, Types::UserType, null: false
    field :from_user, Types::UserType, null: false
    field :to_user, Types::UserType, null: false
  end
end
```
graphql/types/query_type.rb
```ruby
module Types
  class QueryType < Types::BaseObject
    field :like, Types::LikeType, null: false do
      description 'いいね情報(id指定で1件)'
      argument :id, ID, required: true
    end

    def like(id:)
      Like.find(id)
    end

    field :likes, [Types::LikeType], null: false do
      description 'いいね情報(全件)'
    end

    def likes
      Like.all
    end

  end
end
```
graphql/types/mutation_type.rb
```ruby
module Types
  class MutationType < Types::BaseObject
    field :createLikeFrom, mutation: Mutations::CreateLikeFrom
  end
end
```
graphql/mutations/create_like_from.rb
```ruby
module Mutations
  class CreateLikeFrom < BaseMutation
    graphql_name 'CreateLikeFrom'

    field :user, Types::UserType, null: false
    field :like, Types::LikeType, null: false

    argument :id, ID, required: true
    argument :user_id, ID, required: true
    argument :from_user_id, ID, required: true
    argument :to_user_id, ID, required: true
    argument :from_user, Integer, required: true
    argument :to_user, Integer, required: true

    def resolve(**args)
      user = User.find(args[:user_id])
      user.likes_from.create!(to_user_id: to_user_id)
      {
        like: like,
      }
    rescue => e
      GraphQL::ExecutionError.new(e.message)
    end
  end
end
```

GraphQLとrailsでユーザー同士のLike機能を実現したい

### 前提

Next.js、Reactを用いたアプリケーションを作成しております。
使用機器: Mac m1
エディタ: vscode

### 実現したいこと

apolloを用いてgraphQLを叩きたい。

### 発生している問題・エラーメッセージ

```
error - ./node_modules/next-apollo/dist/link.js:40:0
Module not found: Can't resolve 'next/dist/next-server/lib/utils'

Import trace for requested module:
./node_modules/next-apollo/dist/index.js
./lib/apollo.js
./pages/_app.js

https://nextjs.org/docs/messages/module-not-found
```

### 該当のソースコード

```JavaScript
import { HttpLink } from "apollo-link-http";
import { withData } from "next-apollo";

const API_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:1337";

const config = {
    link: new HttpLink({
        uri: `${API_URL}/graphql`, 
    }), 
};

export default withData(config);
```

また、上記2行目の "next-apollo"; の部分にカーソルを合わせると、vscode上に下記のようなメッセージが表示されます。

```
モジュール 'next-apollo' の宣言ファイルが見つかりませんでした。'<ROOT_PATH>/node_modules/next-apollo/dist/index.js' は暗黙的に 'any' 型になります。
  存在する場合は `npm i --save-dev @types/next-apollo` を試すか、`declare module 'next-apollo';` を含む新しい宣言 (.d.ts) ファイルを追加しますts(7016)
```

### 試したこと

```
npm i --save-dev @types/next-apollo
```

vscode上に表示されたエラー内容に倣ってインストール実行してみましたが、Not Found Error が発生しました。

そのほかに色々調べてみたのですが、クリティカルな記事が見つからず現在に至っております。

### 補足情報（FW/ツールのバージョンなど）

node -v: v14.20.0

知識不足や情報不足等あるかと思いますが、もし知見のある方がいらっしゃる場合、ご教示頂けたら幸いです。


「Module not found: Can't resolve 'next/dist/next-server/lib/utils'」の原因が分かる方いらっしゃいませんか？

### 前提

Next.js/TypeScript/GraphQL/Postgresを使って、店舗の1日の情報を記録する日報を作成しております。
Prismaを使って保存した値(total)を取得するようにしたいのですが処理がうまくいきません。
prisma.tsというファイルでの記載方法のアドバイスをいただきたいです。

### 実現したいこと

- [ ] dailyReportテーブルのtotalというカラムから値を取得したい

### 事前情報
modelの情報
- Company = 企業
- Shop = 店舗
- DailyReport = 日報

取得したい値
total = 人件費

### 該当のソースコード

```schema.ts
model Company {
  id                   Int                    @id @default(autoincrement())
  name                 String                 @db.VarChar(255)
  slug                 String                 @unique @db.VarChar(255)
  createdAt            DateTime?              @default(now()) @map("created_at") @db.Timestamp(0)
  updatedAt            DateTime?              @updatedAt @map("updated_at") @db.Timestamp(0)
  email                String?                @unique @db.VarChar(255)
  shops                Shop[]
}

model Shop {
  id               Int               @id @default(autoincrement())
  name             String            @db.VarChar(255)
  companyId        Int               @map("company_id")
  shopId           Int?              @map("shop_id")
  DailyReport   DailyReport[]
  @@unique([companyId, shopId], name: "shops_company_id_shop_id_unique")
  @@map("shops")
}

model DailyReport {
  id                   Int       @id @default(autoincrement())
  shopId               Int       @map("shop_id")
  date                String?
  total         Int?      @map("rent_cost")
  createdAt            DateTime? @default(now()) @map("created_at") @db.Timestamp(0)
  updatedAt            DateTime? @default(now()) @map("updated_at") @db.Timestamp(0)

  shop           Shop             @relation(fields: [shopId], references: [id])
  @@index([shopId], name: "monthly_reports_shop_id_index")
  @@map("monthly_reports")
}

```

```prisma.ts
async getDailyReports(companySlug: string, shopId: number, date: string): Promise<number> {
    return (
      this.prisma.shop
        .findFirst({
          where: {
            shopId,
            company: {
              slug: companySlug,
            },
          },
        })
        .then(shop => {
          if (!shop) throw 'Shop not found';
          return (
            this.prisma.dailyReport
              .findFirst({
                where: {
                  shopId: shop.id,
                  date: date,
                },
              })
              .then(dailyReports => {
                return dailyReports.map(dailyReport => {
                  const { total } = dailyReport;
                  return {
                    total,
                  };
                });
              })
          );
        })
    );
  }
```

### 試したこと
0. prisma.tsのgetDailyReportsの引数で受け取った、companySlugと shopIdから取得したい店舗の情報を取得
0. dailyReportから該当するshopIdとdateのレコードを取得
0. 取得したレコードからtotalを返す





prismaでの値の取得方法

### 実現したいこと

・ECCUBE4から商品情報を取得してWordPressの固定ページに商品一覧を表示させたい（※在庫なし商品のみ）

### 前提

EC-CUBE4のプラグイン「Web API」とWordPressのプラグイン「Code Snippets」を使用して、
WordPressの固定ページにショートコードで
商品一覧を表示しようとしていますが方法が分からずに躓いております。
ご教授いただけますと幸いです。

下記のページを参考に実装作業をしています。
https://doc.ec-cube.net/eccube-api4/
https://cajiya.co.jp/column/7620

### 現状できている事

参考にしたページの順序通りに実装したところ
商品ID毎に取得する事には成功しております。
在庫が1以上あるものは表示しないようにすることも成功しております。

### 試したこと

```php
/**
* IDから商品を取得＆表示するショートコード
*
* @param int $atts[id] EC-CUBEの商品ID
* @return string|false HTML
*/
if( !function_exists('shortcode__eccube_product') ) :
function shortcode__eccube_product( $atts ) {
    $id = false;
    if( isset($atts['id']) ) $id = $atts['id'];
    if( !$id ) return false;

    $query = <<< EOD
    query {
        product(id: {$id}) {
            id
            name
            ProductClasses{
              stock
              price01
              price02
			  visible
            }
            ProductCategories{
              Category{
                name
              }
            }
            ProductImage{
              file_name
            }
        }
    }
EOD;

    $response = json_decode( request_query_to_eccube($query) );
    if( $response == false || isset($response->error) ){
        return false;
        $accesstoken = refresh_eccube_access_token();
        if( isset( $accesstoken ) ){
            $response = json_decode( request_query_to_eccube($query) );
        }
    }
    if( $response != false && !isset($response->error) ){
        $product = convert_raw_product_data( $response->data->product );
        if( !$product ) return false;
		if( ($product->stock)>=1 ) return false;
        // return json_encode($product);
        return <<< EOD
        <div class="itemlist" id="item-{$product->id}">
		<a href="{$product->url}" target="_blank" rel="noopener noreferrer">
            <div class="thumb"><img src="https://www.example.com/store/html/upload/save_image/{$product->thumbnail}" alt="">
            <div class="text">
                
                <h3>{$product->name}</h3>
                
            </div>
			</div>
			</a>
        </div>
EOD;
    }
}
endif;
add_shortcode( 'eccube_product', 'shortcode__eccube_product' );

/**
* 商品一覧を取得＆表示するショートコード
*/
if( !function_exists('shortcode__eccube_productlist') ) :
function shortcode__eccube_productlist() {
	$query = <<< EOD
    query {
  products{
      id
            name
            ProductClasses{
              stock
              price01
              price02
			  visible
            }
            ProductCategories{
              Category{
                name
              }
            }
            ProductImage{
              file_name
            }
        }
}

EOD;
	
$response = json_decode( request_query_to_eccube($query) );
    if( $response == false || isset($response->error) ){
        return false;
        $accesstoken = refresh_eccube_access_token();
        if( isset( $accesstoken ) ){
            $response = json_decode( request_query_to_eccube($query) );
        }
    }
    if( $response != false && !isset($response->error) ){
        $product = convert_raw_product_data( $response->data->product );
        if( !$product ) return false;
		if( ($product->stock)>=1 ) return false;
        // return json_encode($product);
        return <<< EOD
        <div class="itemlist" id="item-{$product->id}">
		<a href="{$product->url}" target="_blank" rel="noopener noreferrer">
            <div class="thumb"><img src="https://www.example.com/store/html/upload/save_image/{$product->thumbnail}" alt="">
            <div class="text">
                
                <h3>{$product->name}</h3>
                
            </div>
			</a>
        </div>
EOD;
    }
}
endif;
add_shortcode( 'eccube_product_list', 'shortcode__eccube_productlist' );
```

### 補足情報（FW/ツールのバージョンなど）

WordPress 6.1.1
ECCUBE 4.1.2
Web API 2.1.3
Code Snippets 3.2.2

ECCUBE4から商品情報を取得してWordPressの固定ページに商品一覧を表示する

#概要
GraphQLのレスポンスが下記のようになっております。
```ここに言語を入力
{
  "products": {
    "edges": [
      {
        "node": {
          "description": "Sleek and black",
          "featuredImage": {
            "id": "gid://shopify/ProductImage/15464783282345",
            "originalSrc": "https://cdn.shopify.com/s/files/1/0268/1005/6873/products/bb20.jpg?v=1602116082"
          },
          "handle": "skirt",
          "id": "gid://shopify/Product/4773734482089",
          "images": {
            "edges": [
              {
                "node": {
                  "id": "gid://shopify/ProductImage/15464783282345",
                  "originalSrc": "https://cdn.shopify.com/s/files/1/0268/1005/6873/products/bb20.jpg?v=1602116082"
                }
              },
              {
                "node": {
                  "id": "gid://shopify/ProductImage/26072838406313",
                  "originalSrc": "https://cdn.shopify.com/s/files/1/0268/1005/6873/products/bb7.jpg?v=1612636091"
                }
              },
              {
                "node": {
                  "id": "gid://shopify/ProductImage/26072838373545",
                  "originalSrc": "https://cdn.shopify.com/s/files/1/0268/1005/6873/products/bb6.jpg?v=1612636091"
                }
              }
            ]
          }
        }
      }
    ]
  }
}
```

#やりたいこと
edgesの値は配列。nodeの値はオブジェクトとなっています。
これを下記のようにedgesやnodeのない値に変換したいと考えております。
```ここに言語を入力
{
  "products": [
      {
          "description": "Sleek and black",
          "featuredImage": {
            "id": "gid://shopify/ProductImage/15464783282345",
            "originalSrc": "https://cdn.shopify.com/s/files/1/0268/1005/6873/products/bb20.jpg?v=1602116082"
      },
```

#Use Playgreound
Use Playgreoundにアップロードしました。
[Use Playgreound](https://www.typescriptlang.org/play?#code/MYewdgzgLgBCBOBLA5osBDANjAvDA3gFAwwBEADvCACYCuwUEpAXAcSWQKbXKdOsBtdhzYiRpMDU4tRY8dT7Ak5KInAzSAZUydOAaxjow1GACNM6YHtIAaYXLIAzTuii143AJIBbdLxlEDmKkiNQaqNTMAPRREAAWIOSIjgCeUQAKVHQMPn6cUQCMAKwALABsJQDsABwAzABM1fW1JUW29kGkCChoWJrwwBpxUFDkENFRwNRgAHTxickpM6DesVGOiDoQhVEADPVl1YW7u0VRh5W1UZQ09IxRpqb1uzMAVuTIAPwAbjgFZfsCv9dk1SB0xABfOxBEikOJGag6DQQPSIeBQdowsihcKhCbzJKpDJZO5RKqXS4lEpNEEATkxMJCvl4-FkWNI3BZMiEWJEgV54kkCgC4IFITCrFIEXxCUJaUytxyzPyxXKVTqjWarQZAvE3VQGEw-UGkuGo3GMSmswJi2WIFW2w2Wx2+0Ox1O52ql2uJIY20ezzeHx+fwB9SBANBophEOjcihcbE-N1ZCF0lYyZT2IlZGlMRtRIV2SguV4UQOu0qjVq1RKuzKtQKtR1Wa6SANfQGQxGYwmVrmsttKzWTr4LoORwKJzOFyuN2L-tMlSDX1+-wKB1qANpBTBWZgsZTCZTmbFaZF+9hOMledig8LvpLyvLAKrdTql1KbWhl7bPUNxrduafbTAOCypHaDrrJsY4FHsE7ujOXpzo+i5lCuIbrpu267om8Z4Rwh68gAuomRH4RRHCkSQsaxoQoCQLADHfJw6LcLgsgUKh3LgqewQKBASiICoahgBo2i6AYCJmBYVgtnIpDOK47heMqF68uKuKRPm97yo+pYqqUFQ1A0TQtN+BF-h2RpdqaPYWpMoEFksw6OjB2xwa6k7Tp63rznci6Bu8q6hoCwJRpRIhEaREJAA)

#質問
なんとなく、objectを配列ように扱って各keyの名前がedgesやnodeで処理加えればいいのかなと思います。
しかし、いくつか問題点があります。
- 多次元オブジェクトであること
- オブジェクトを配列のように扱って、そのあとオブジェクトに戻すという方法が思いつきません。

どのようにすれば、「やりたいこと」に書いてるコードのように変換できますでしょうか？

オブジェクトを見やすく変換したい

GraphQLをPOSTで行いたいのですがエラー404になってしまいます。
おそらくqueryのフォーマットが悪い？のかと思うのですが、何かお気づきの点がありましたら教えてほしいです。
よろしくお願いいたします。

> 実行時のエラー404
> {"errors":[{"message":"Syntax Error: Expected Name, found \"$\".","extensions":
> {"code":"GRAPHQL_PARSE_FAILED","exception":{"stacktrace":["GraphQLError: Syntax Error: Expected Name, found \"$\".","    at syntaxError (/home/node/app/node_modules/graphql/error/syntaxError.js:15:10)","    at Parser.expectToken 

参考にしたサイト：
https://zenn.dev/msksgm/articles/shopify-api-python-request-graphql


GraphQLについて

下記の質問についてご存知の方がいらっしゃいましたらご教示を願います。

---

## 【質問の主旨】

Apollo Graphql Studioで下記のGraphQLを実行しました。

```ここに言語を入力
query GetLaunches {
  launches {
    id
    mission {
      name
    }
  }
}

```
すると画面上に** "message": "Cannot read property 'launchAPI' of　undefined** と言うエラーが表示されます。このエラーを表示させず、クエリが要求するAPIデータをApollo Graphql Studioの画面上で表示させるためにはどうすれば良いでしょうか？」

![イメージ説明](b36052fc32d67d7c54d053590e5765e6.png)


## 【質問の補足】

### 1.

私は[Apollo Basicsのチュートリアル](https://apollographql-jp.com/tutorial/introduction/)に沿って、Webアプリを作成しようとしています。そのチュートリアルの[Run queries in the playground](https://apollographql-jp.com/tutorial/resolvers/#run-queries-in-the-playground)と言う箇所を見て、上記のクエリを作成しました。

### 2. 

このクエリを実行するためのファイ群全体は、[GitHub](https://github.com/echizenyayota/fullstack-tutorial/tree/developer_20211214)にUPしています。

### 3. 

Apollo Graphql Studioで表示されたエラーメッセージを読むと、 "Cannot read property 'launchAPI' of undefined「launchAPIのプロパティが属性が読むことができません」"となっています。ですが個人的には、launch.jsでLaunchAPIクラスを[チュートリアル](https://apollographql-jp.com/tutorial/data-source/#connect-a-rest-api)に書かれているものと同じ内容を記述しているつもりです([GitHub](https://github.com/echizenyayota/fullstack-tutorial/blob/developer_20211214/start/server/src/datasources/launch.js))。にもかかわらず、エラーが表示されることには納得がいきません。

---

以上、ご確認をよろしくお願い申し上げます。

Apollo Graphql Studio で"Cannot read property 'launchAPI' of　undefined と言うエラーが表示されます。このエラーを表示させないためには

GolangとGraphQLの勉強をしています。
下記のサイトを参考にしながらGoの環境を構築していたのですが```gqlgen init```のコマンドを実行したら
```ここに言語を入力
bash: gqlgen: command not found
```
とターミナルにメッセージが表示されました。
解決方法わかる人いましたらご教授お願いしたいです。

[参考にしたサイト](https://qiita.com/Y_uuu/items/54c2749eca5b67ae9583?utm_campaign=popular_items&utm_medium=feed&utm_source=popular_items)


実行したコマンド
```
$ mkdir with-apollo-api
$ cd with-apollo-api
$ go mod init github.com/yuuu/with-apollo-api
$ go get github.com/99designs/gqlgen
$ go get github.com/rs/cors

# gqlgenでgraph/schema.graphqlsを生成
$ gqlgen init
```